数据表自定义处理行为

Question

我使用的数据表是我的网络应用程序。我启用了下拉菜单，用户可以在其中 select 他们希望看到的条目数。

目前，当用户 select 要显示的条目数时，我已启用处理消息。

我想做的不是显示处理消息，而是希望我的页面上的一个按钮（已经存在，带有 id）被禁用并显示一些其他文本，如 "Loading"（即覆盖自定义处理行为）。然后一旦处理完成，我希望按钮 return 回到它的原始状态（即启用原始文本）。

这可能吗？我该怎么做？这是我当前的数据表初始化代码。

$('#search-results-table').dataTable({
    'bServerSide': true,                                // user server side processing
    'sAjaxSource': searchResultsTableAjaxServletUrl,    // load data from an external source                
    'bProcessing': true,                                // enable the processing indicator whilst table is loading
    'deferRender': true,
    'searching': false,                                 // disable search box
    'sPaginationType': 'full_numbers', 
    'oLanguage': {
        'sEmptyTable': 'Items not found.'
    },          
    'fnServerData': function ( sSource, aoData, fnCallback ) {
        $.getJSON( sSource, aoData, function (data) {                
            //there was a web service error
            if ('errorMessage' in data) {
                $('div#errorMessage h2').html(data.errorMessage);
                    fnCallback({ 'aaData': [], 'iTotalDisplayRecords': 0, 'iTotalRecords': 0, 'sColumns': null, 'sEcho': 1});
            }
            // only if expected json array is returned go ahead and load
            if (('aaData' in data)) {
                fnCallback(data);
            }
        })
        .fail(function() { 
            $('div#errorMessage h2').html('Search service unavailable, please contact IT support or try again later');
                fnCallback({ 'aaData': [], 'iTotalDisplayRecords': 0, 'iTotalRecords': 0, 'sColumns': null, 'sEcho': 1});            
        });
    },
    'initComplete': function(settings, json) {
        enableFields('#searchButton');
    },                          
    'aoColumnDefs':[{  
        'aTargets': [ 4 ], 
        'mRender': function ( data, type, full )  {
            return  '<a href="javascript:setItemNumber(' + data + ');">' + data + '</a>';
        }
    }],              
    'aoColumns': [
        {'mDataProp':'itemDescription','bSortable':false,sDefaultContent:'','sWidth':'40%'},
        {'mDataProp':'size','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'},   
        {'mDataProp':'colour','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'},                     
        {'mDataProp':'supplyStyle','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'},
        {'mDataProp':'itemNumber','bSortable':false,'sClass':'center',sDefaultContent:'','sWidth':'15%'}
   ]

});

Answer 1

我将其添加到我的数据表代码中以覆盖处理函数的默认行为。我还将 bProcessing 设置为 false。

 $('#search-results-table')  .on('processing.dt',function( e, settings, processing ){
     if (processing){
             disableSearchButton();
     }else {
             enableSearchButton();
     }
     } )

数据表自定义处理行为

Datatable custom processing behaviour

datatable

jquery