Advertisement
Guest User

datatables js

a guest
May 6th, 2015
1,266
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. // ajax urls used to init tables
  2. var searchResultsTableAjaxServletUrl = null;
  3. var relatedItemsTableAjaxServletUrl = null;
  4. var stockOnHandTableAjaxServletUrl = null;
  5.  
  6. //flags indicating which tables to load
  7. var loadSearchResultsTbl = null;
  8. var loadRelatedItemsTbl = null;
  9. var loadStockOnHandTbl = null;
  10.  
  11. $().ready(function() {     
  12.    
  13.     if (loadSearchResultsTbl){     
  14.         doSearchResultsTbl();    
  15.     }else {
  16.         $('#search-results-row').hide();
  17.     }
  18.    
  19.     if (loadRelatedItemsTbl){
  20.         doRelatedItemTbl();
  21.     }else{
  22.         $('#related-item-row').hide();
  23.     }    
  24.  
  25.     if (loadStockOnHandTbl){
  26.         doStockOnHandTbl();
  27.         $('#backButton').show();
  28.     }else{
  29.         $('#stock-on-hand-row').hide();
  30.     }    
  31.  
  32. });
  33.  
  34. function doSearchResultsTbl() {
  35.     // unhide table
  36.     $('#search-results-row').show();
  37.    
  38.     // initialise the table
  39.     $('#search-results-table')
  40.     .on('processing.dt',function( e, settings, processing ){
  41.         if (processing){
  42.             scrollToTop();
  43.             disableSearchButton(); 
  44.             $('#search-results-table_length :input').prop('disabled', true );
  45.                
  46.         }else {
  47.             enableSearchButton();
  48.             $('#search-results-table td:empty').html(' ');
  49.         }
  50.     } )
  51.     .dataTable({
  52.         'bServerSide': true,                               
  53.         'sAjaxSource': searchResultsTableAjaxServletUrl,                   
  54.         'bProcessing': false,                              
  55.         'deferRender': true,
  56.         'searching': false,
  57.         'scrollX': false,                              
  58.         'sPaginationType': 'full',
  59.         'oLanguage': {
  60.             'sEmptyTable': 'Items not found.'
  61.         },          
  62.         'fnServerData': function ( sSource, aoData, fnCallback ) {
  63.             $.getJSON( sSource, aoData, function (data) {                
  64.                 //there was a web service error
  65.                 if ('errorMessage' in data) {
  66.                     $('div#errorMessage h2').html(data.errorMessage);
  67.                     $('div#errorMessage').show();
  68.                     $('#search-results-table_length :input').prop('disabled', true );
  69.                     fnCallback({ 'aaData': [], 'iTotalDisplayRecords': 0, 'iTotalRecords': 0, 'sColumns': null, 'sEcho': 1});
  70.                 }else{
  71.                     $('#search-results-table_length :input').prop('disabled', false );
  72.                 }
  73.                 // only if expected json array is returned go ahead and load
  74.                 if (('aaData' in data)) {
  75.                         fnCallback(data);
  76.                 }
  77.             })
  78.             .fail(function() {
  79.                 $('div#errorMessage h2').html('Search service unavailable, please contact IT support or try again later');
  80.                 $('div#errorMessage').show();
  81.                 $('#search-results-table_length :input').prop('disabled', true );
  82.                 fnCallback({ 'aaData': [], 'iTotalDisplayRecords': 0, 'iTotalRecords': 0, 'sColumns': null, 'sEcho': 1});            
  83.             });
  84.         },
  85.         'initComplete': function(settings, json) {
  86.             enableSearchButton();
  87.             $('#search-results-table td:empty').html(' ');
  88.         },                         
  89.         'aoColumnDefs':[{  
  90.             'aTargets': [ 4 ],
  91.             'mRender': function ( data, type, full )  {
  92.                 return  '<a href="javascript:setItemNumber(' + data + ');">' + data + '</a>';
  93.             }
  94.         }],              
  95.         'aoColumns': [
  96.             {'mDataProp':'itemDescription','bSortable':false,'sClass':'left',sDefaultContent:'','sWidth':'40%'},
  97.             {'mDataProp':'size','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'},  
  98.             {'mDataProp':'colour','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'},                    
  99.             {'mDataProp':'supplyStyle','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'},
  100.             {'mDataProp':'itemNumber','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'}
  101.         ]                                            
  102.     });    
  103. }
  104.  
  105. function doRelatedItemTbl() {
  106.     // unhide table
  107.     $("#related-item-row").show();
  108.    
  109.     // initialise the table
  110.     $('#related-item-table')
  111.     .on('processing.dt',function( e, settings, processing ){
  112.         if (processing){
  113.             scrollToTop();
  114.             disableSearchButton();
  115.         }else {
  116.             enableSearchButton();
  117.             $('#related-item-table td:empty').html('&nbsp;');
  118.         }
  119.     } )    
  120.     .dataTable({
  121.         'bServerSide': true,               
  122.         'sAjaxSource': relatedItemsTableAjaxServletUrl,            
  123.         'bProcessing': false,                  
  124.         'deferRender': true,
  125.         'scrollX': false,
  126.         'scrollY': '120px',
  127.         'scrollCollapse': true,
  128.         'searching': false,                    
  129.         'bLengthChange': false,        
  130.         'sPaginationType': 'full',
  131.         'oLanguage': {
  132.             'sEmptyTable': 'Items not found.'
  133.         },          
  134.         'fnServerData': function ( sSource, aoData, fnCallback ) {
  135.             $.getJSON( sSource, aoData, function (data) {                
  136.                 //there was a web service error
  137.                 if ('errorMessage' in data) {
  138.                     $('div#errorMessage h2').html(data.errorMessage);
  139.                     $('div#errorMessage').show();
  140.                     fnCallback({ 'aaData': [], 'iTotalDisplayRecords': 0, 'iTotalRecords': 0, 'sColumns': null, 'sEcho': 1});
  141.                 }
  142.                 // only if expected json array is returned go ahead and load
  143.                 if (('aaData' in data)) {
  144.                     fnCallback(data);
  145.                 }
  146.             })
  147.             .fail(function() {
  148.                 $('div#errorMessage h2').html('Search service unavailable, please contact IT support or try again later');
  149.                 $('div#errorMessage').show();
  150.                 fnCallback({ 'aaData': [], 'iTotalDisplayRecords': 0, 'iTotalRecords': 0, 'sColumns': null, 'sEcho': 1});            
  151.             });
  152.         },  
  153.         'initComplete': function(settings, json) {
  154.             enableSearchButton();
  155.             $('#related-item-table td:empty').html('&nbsp;');
  156.         },                      
  157.         'aoColumnDefs':[{  
  158.             'aTargets': [ 4 ],
  159.             'mRender': function ( data, type, full )  {
  160.                 return  '<a href="javascript:setItemNumber(' + data + ');">' + data + '</a>';
  161.             }
  162.         }],                      
  163.         'aoColumns': [
  164.             {'mDataProp':'itemDescription','bSortable':false,'sClass':'left',sDefaultContent:'','sWidth':'40%'},
  165.             {'mDataProp':'size','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'},  
  166.             {'mDataProp':'colour','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'},                    
  167.             {'mDataProp':'supplyStyle','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'},
  168.             {'mDataProp':'itemNumber','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'}
  169.        ]                                         
  170.    });     
  171. }
  172.  
  173. function doStockOnHandTbl() {  
  174.     // unhide table
  175.     $('#stock-on-hand-row').show();
  176.    
  177.     // initialise the table
  178.     $('#stock-on-hand-table')  
  179.     .dataTable({
  180.         'bServerSide': true,                               
  181.         'sAjaxSource': stockOnHandTableAjaxServletUrl,                     
  182.         'bProcessing': false,                              
  183.         'deferRender': true,
  184.         'searching': false,                                
  185.         'bInfo': false,
  186.         'scrollX': false,
  187.         'scrollY': '150px',        
  188.         'scrollCollapse': true,
  189.         'paging': false,
  190.         'oLanguage': {
  191.             'sEmptyTable': 'Stock on hand not available.'
  192.         },          
  193.         'fnServerData': function ( sSource, aoData, fnCallback ) {
  194.             $.getJSON( sSource, aoData, function (data) {                
  195.                 //there was a web service error
  196.                 if ('errorMessage' in data) {
  197.                     $('div#errorMessage h2').html(data.errorMessage);
  198.                     $('div#errorMessage').show();
  199.                     fnCallback({ 'aaData': [], 'iTotalDisplayRecords': 0, 'iTotalRecords': 0, 'sColumns': null, 'sEcho': 1});
  200.                 }
  201.                 // only if expected json array is returned go ahead and load
  202.                 if (('aaData' in data)) {
  203.                     fnCallback(data);
  204.                 }
  205.             })
  206.             .fail(function() {
  207.                 $('div#errorMessage h2').html('Search service unavailable, please contact IT support or try again later');
  208.                 $('div#errorMessage').show();
  209.                 fnCallback({ 'aaData': [], 'iTotalDisplayRecords': 0, 'iTotalRecords': 0, 'sColumns': null, 'sEcho': 1});            
  210.             });
  211.         },             
  212.         'aoColumns': [
  213.             {'mDataProp':'location','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'20%'},
  214.             {'mDataProp':'locationName','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'40%'},  
  215.             {'mDataProp':'region','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'20%'},                    
  216.             {'mDataProp':'count','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'20%'}
  217.        ]                                         
  218.    });
  219. }
  220.  
  221. function setItemNumber(data) {
  222.     $('#hiddenForm input[name=itemNumber]').val(data);
  223.     $('#hiddenForm').submit();
  224.     return false;
  225. }
  226.  
  227. function formSubmit() {
  228.     $('#inputForm').submit();      
  229. }
  230.  
  231. function searchResultsFromCancel() {   
  232.     $('#inputForm input[name=fromBackButton]').val('true');
  233.     $('#inputForm').submit();          
  234. }
  235.  
  236. function enableSearchButton() {
  237.     enableFields('#searchButton');
  238.     $("#searchButton").prop('value', 'Search');
  239. }
  240.  
  241. function disableSearchButton() {
  242.     disableFields('#searchButton');
  243.     $("#searchButton").prop('value', 'Loading...');
  244. }
  245.  
  246. function scrollToTop() {
  247.     $('html, body').animate({
  248.         scrollTop: "0px"
  249.     }, 800);
  250. }
  251.  
  252.  
  253. // reset fields
  254. function clearFields() {
  255.     $('#keywords').val('');
  256.     $('#itemNumber').val('');
  257.     $('#itemDescription').val('');
  258.     $('#classGroup').val('');
  259.     $('#classGroupDescription').val('');
  260.     $('#brandName').val('');
  261.     $('#apn').val('');
  262.     $('#supplierName').val('');
  263.     $('#class').val('');
  264.     $('#supplier').val('');
  265.     $('#subclass').val('');
  266.     $('div#errorMessage').html('');
  267.     $('div#errorMessage').hide();  
  268. }
  269.  
  270. function disableFields(selector, clear) {
  271.     var field = $(selector);
  272.     field.attr('disabled', 'disabled');
  273.     field.addClass('disabled');    
  274.     if (clear === true) {
  275.         $(selector).val('');
  276.     }
  277. }
  278.    
  279. function enableFields(selector) {
  280.     var field = $(selector);
  281.     field.removeAttr('disabled');
  282.     field.removeClass('disabled');
  283. }
  284.  
  285. // initialise variables
  286. function init(params) {
  287.     searchResultsTableAjaxServletUrl = params.searchResultsTableAjaxServletUrl;
  288.     relatedItemsTableAjaxServletUrl = params.relatedItemsTableAjaxServletUrl;
  289.     stockOnHandTableAjaxServletUrl = params.stockOnHandTableAjaxServletUrl;
  290.        
  291.     loadSearchResultsTbl = (params.loadSearchResultsTbl === 'true');
  292.     loadRelatedItemsTbl = (params.loadRelatedItemsTbl === 'true');
  293.     loadStockOnHandTbl = (params.loadStockOnHandTbl === 'true');   
  294. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement