diff --git a/lib/NGCP/Panel/Controller/Customer.pm b/lib/NGCP/Panel/Controller/Customer.pm
index 756dbf863a..fb8293e03f 100644
--- a/lib/NGCP/Panel/Controller/Customer.pm
+++ b/lib/NGCP/Panel/Controller/Customer.pm
@@ -820,17 +820,17 @@ sub invoice_data :Chained('base') :PathPart('invoice') :CaptureArgs(0) {
     my $etime = $stime->clone->add(months => 1);
 
     #look, NGCP::Panel::Utils::Contract - it is kind of backend separation here
-    my $zonecalls_rs = NGCP::Panel::Utils::Contract::get_contract_calls_rs(
+    my $invoice_details = NGCP::Panel::Utils::Contract::get_contract_calls_rs(
         c => $c,
         contract_id => $contract_id,
         stime => $stime,
         etime => $etime,
     );
     #FAKE FAKE FAKE FAKE
-    $zonecalls_rs = [$zonecalls_rs->all()];
+    $invoice_details = [$invoice_details->all()];
     my $i = 1;
-    $zonecalls_rs = [map{[$i++,$_]} (@$zonecalls_rs) x 21];
-    $c->stash(zonecalls_rs => $zonecalls_rs );
+    $invoice_details = [map{[$i++,$_]} (@$invoice_details) x 21];
+    $c->stash(invoice_details => $invoice_details );
 }
 #method separated as some day 
 sub invoice_template_list :Chained('invoice_data') :PathPart('') :CaptureArgs(0) {
diff --git a/share/templates/customer/invoice.tt b/share/templates/customer/invoice.tt
index 7e226a8359..344f49559e 100644
--- a/share/templates/customer/invoice.tt
+++ b/share/templates/customer/invoice.tt
@@ -1,3 +1,9 @@
+[% USE Dumper %]
+
+[%PROCESS 'helpers/datatables_vars.tt'
+    no_auto_helper = 1 
+-%]
+
 [% IF c.user.roles == "subscriber" || c.user.roles == "subscriberadmin" -%]
     [% site_config.title = c.loc('Invoice template manager') -%]
 [% ELSE -%]
@@ -8,18 +14,6 @@
 [% write_access = 1 %]
 [%END%]
 
-
-<div class="row">
-    <span>
-        <a class="btn btn-primary btn-large" href="[% c.uri_for('/back') %]"><i class="icon-arrow-left"></i> [% c.loc('Back') %]</a>
-    </span>
-</div>
-<div class="ngcp-separator"></div>
-[% back_created = 1 -%]
-
-
-[% USE Dumper %]
-
 <script type="text/javascript" src="/js/libs/svg-edit/embedapi.js"></script>
 <script type="text/javascript">
 var svgCanvas = null;
@@ -40,16 +34,12 @@ function init_embed() {
 }
 
 function loadSvg(params) {
-    alert('[%- c.uri_for_action("/customer/invoice_template", [contract.id]) -%]'+params);
+    //alert('[%- c.uri_for_action("/customer/invoice_template", [contract.id]) -%]'+params);
     $.ajax({
         url: '[%- c.uri_for_action("/customer/invoice_template", [contract.id]) -%]'+params,
     }).done(function(svgParsedString){
-            //alert(httpResponse);
             svgCanvas.setSvgString(svgParsedString);
     });
-    //'/customer/[%contract.id%]/calls/svg'
-    //var svgexample = '<svg width="640" height="480" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"><g><title>Layer 1</title><rect stroke-width="5" stroke="#000000" fill="#FF0000" id="svg_1" height="35" width="51" y="35" x="32"/><ellipse ry="15" rx="24" stroke-width="5" stroke="#000000" fill="#0000ff" id="svg_2" cy="60" cx="66"/></g></svg>';
-    //svgCanvas.setSvgString(svgexample);
 }
 
 function showSvgParsed(){
@@ -62,23 +52,11 @@ function handleShowSvgParsedData(svgString, error) {
     }
     else
     {
-        //alert('Congratulations. Your SVG string is back in the host page, do with it what you will\n\n' + data);
-        //alert(encodeURIComponent(data));
         var q = '[%- c.uri_for_action("/customer/invoice_template", [contract.id]) -%]'+'/svg/parsed/previewed'; 
-        //alert(q);
-        //alert(data);
         $.post( q, { template: svgString })
         .done( function( svgParsedString ) {
-            //alert(svgParsedString);
             var previewIframe = document.getElementById('svgpreview'); //new Image();
             var previewDoc = previewIframe.contentWindow.document;
-            //if(previewIframe.contentDocument) { 
-            //  doc = previewIframe.contentDocument; 
-            //} else {
-            //  doc = previewIframe.contentWindow.document; 
-            //}
-            //previewIframe.contentWindow.document.body.innerHTML='<html></html>';
-            //alert(doc);
             var pages = new Array();
             pages = svgParsedString.match(/(<svg[\r\n\t\s\S\w\W]*?(?:\/svg>))/gi );
             if(!pages){
@@ -89,28 +67,9 @@ function handleShowSvgParsedData(svgString, error) {
                 previewIframe.src = '';
                 previewDoc.body.innerHTML = '<html><body>'+svgParsedString+'</body></html>';
                 alert(previewDoc.body.innerHTML);
-                /*
-                var i;
-                for( i = 0; i < previewDoc.images.length; i++ ){
-                    var img = previewDoc.images[i];
-                    img.parentElement.remove(img);
-                }
-                
-                for( i = 0; i < pages.length; i++ ){
-                    img = previewDoc.createElement('img');
-                    //alert(img);
-                    //img.width=215;
-                    //img.heith=297;
-                    img.src = "data:image/svg+xml," + encodeURIComponent(pages[i]);
-                }
-                alert('images='+previewDoc.images.length);
-                alert(previewDoc.body.innerHTML);
-                */
             }else{
                 previewIframe.src = "data:image/svg+xml," + encodeURIComponent(svgParsedString);
             }
-            //alert(img.outerHTML);
-            //alert(img.html());
         });
     }
 }
@@ -126,10 +85,6 @@ function handleSaveSvgData(data, error) {
     else
     {
         var q = '[%- c.uri_for_action("/customer/invoice_template", [contract.id]) -%]'+'/svg/parsed/saved'; 
-        //alert(q);
-        //alert(data);
-        //alert('Congratulations. Your SVG string is back in the host page, do with it what you will\n\n' + data);
-        //alert(encodeURIComponent(data));//works in ie
         $.post( q, { template: encodeURIComponent(data) })
         .done(function( httpResponse ) {
 
@@ -138,6 +93,13 @@ function handleSaveSvgData(data, error) {
 }
 </script>
 
+<div class="row">
+    <span>
+        <a class="btn btn-primary btn-large" href="[% c.uri_for('/back') %]"><i class="icon-arrow-left"></i> [% c.loc('Back') %]</a>
+    </span>
+</div>
+<div class="ngcp-separator"></div>
+[% back_created = 1 -%]
 
 <div class="accordion" id="customer_invoice_template">
 
@@ -148,6 +110,17 @@ function handleSaveSvgData(data, error) {
     
     <div class="accordion-body collapse" id="collapse_calls">
     <div class="accordion-inner" style="overflow:auto; height: 300px;">
+    
+    
+[%
+    clearHelper();
+    helper.name = c.loc('Invoice Details');
+    helper.name_single = c.loc('Invoice Record');
+    helper.identifier = 'invoice_details';
+    initHelperAuto();
+    PROCESS 'helpers/datatables.tt';
+-%]
+    
     <table class="table table-bordered table-striped table-highlight table-hover">
     <thead>
         <tr>
diff --git a/share/templates/helpers/datatables_vars.tt b/share/templates/helpers/datatables_vars.tt
index 3481ec890d..2c0d63f19c 100644
--- a/share/templates/helpers/datatables_vars.tt
+++ b/share/templates/helpers/datatables_vars.tt
@@ -2,26 +2,35 @@
 #USE Dumper;
 
 #we can't use DEFAULT directive - it treats false the same as undefined, which doesn't allow to keep default filled values and switch them off by customization
+MACRO clearHelper() BLOCK;
+    FOREACH identifier in [ 'messages', 'length_change', 'dt_columns', 'close_target', 'create_flag', 'form_object', 'ajax_uri' ];
+        helper.${identifier} = '';
+    END
+END;
 MACRO initHelper(var,value) BLOCK;
 #    Dumper.dump(helper);
-    UNLESS helper.${var}.defined; helper.${var} = value || ${var}; END;
+    identifier = "${helper.identifier}" _ "_" _ var;
+    UNLESS helper.${var}.defined; helper.${var} = helper.${var} || value || ${"${identifier}"} || ${var}; END;
 END;
-initHelper('messages');
-initHelper('length_change');
-initHelper('dt_columns', ${"${helper.identifier}_dt_columns"} );
-initHelper('close_target');
-initHelper('create_flag');
-initHelper('form_object',form);
-initHelper('ajax_uri', c.uri_for( c.controller.action_for('ajax') ));
-
-#here we can generate couple of variants, selection of proper variant will be exact view responsibility
-UNLESS c.user.read_only;
-    initHelper('dt_buttons',[
-        { name = c.loc('Edit'), uri = "/${helper.identifier}'+full[\"id\"]+'/edit", class = 'btn-small btn-primary', icon = 'icon-edit' },
-    ] );
-    initHelper('top_buttons',[
-        { name = c.loc("Create ${helper.name_single}"), uri = c.uri_for("/${helper.identifier}/create"), icon = 'icon-star' },
-    ] );
+MACRO initHelperAuto() BLOCK;
+    FOREACH identifier in [ 'messages', 'length_change', 'dt_columns', 'close_target', 'create_flag' ];
+        initHelper(identifier);
+    END
+    initHelper('form_object',form);
+    initHelper('ajax_uri', c.uri_for( c.controller.action_for('ajax') ));
 END;
 
+IF !no_auto_helper;
+    clearHelper();
+    initHelperAuto();
+    #here we can generate couple of variants, selection of proper variant will be exact view responsibility
+    UNLESS c.user.read_only;
+        initHelper('dt_buttons',[
+            { name = c.loc('Edit'), uri = "/${helper.identifier}'+full[\"id\"]+'/edit", class = 'btn-small btn-primary', icon = 'icon-edit' },
+        ] );
+        initHelper('top_buttons',[
+            { name = c.loc("Create ${helper.name_single}"), uri = c.uri_for("/${helper.identifier}/create"), icon = 'icon-star' },
+        ] );
+    END;
+END;
 -%]
\ No newline at end of file