Custom message in sInfo using Scroller

Custom message in sInfo using Scroller

matthewjmatthewj Posts: 39Questions: 2Answers: 0

I am trying to put a custom message in sInfo as below: <span class="lvllbl"></span>
"sInfo": 'There are a total of TOTAL <span class="lvllbl"></span>(s).',

But the Scroller doesn't seem to put the message. If we remove the Scroller it would work just fine and the message is displayed.
I am using Datatable 1.9.4 and Scroller 1.1.0. But this even doesn't work on the latest version.

Here is the code:

$(document).ready(function() {
                var lvllbl;
                var table = $('#hierlvl2list').dataTable( {
                    "sDom": '<"H"Tf<"clear">><"top"i>t<"F">rS',
                    "bJQueryUI": true,
                    "bServerSide": true,
                    "sScrollX": "100%",
                    "sScrollY": "400px",
                    "bScrollCollapse": true,
                    "bAutoWidth": false,
                    "bProcessing": true,
                    "bDeferRender": true,
                    "sAjaxSource": "${pageContext.request.contextPath}/admin/hierarchy/hier_lvl2_list.html?action=listlvlitems&orgid=${param.orgid}",
                    "fnServerData": function ( sSource, aoData, fnCallback, oSettings ) {
                        oSettings.jqXHR = $.ajax( {
                            "url": sSource,
                            "data": aoData,
                            "type": "POST",
                            "dataType": 'json',
                            "success": function(data) {
                                var hasError = fnCheckError(data);
                                if(!hasError) {
                                    lvllbl = data.lvllbl;
                                    fnCallback(data);
                                }
                            }
                        });
                    },
                    "aoColumns": [
                        { "sTitle":"Level Title", "mData": "lvlTitle", "sClass": 'col_header' }
                    ],
                    "oLanguage": {
                        "sInfo": 'There are a total of _TOTAL_ <span class="lvllbl"></span>(s).',
                        "sInfoEmpty": 'There are a total of _TOTAL_ <span class="lvllbl"></span>(s).',
                        "sEmptyTable": 'There are no <span class="lvllbl"></span>(s) to display',
                        "sZeroRecords": 'There are no matching <span class="lvllbl"></span>(s) to display',
                        "sProcessing": 'Please wait - loading <span class="lvllbl"></span> (s) ...'
                    },
                    "fnDrawCallback": function(oSettings) {
                        if(lvllbl) {
                            $('span.lvllbl').html(lvllbl);
                        }
                    },
                    "fnHeaderCallback": function( nHead, aData, iStart, iEnd, aiDisplay ) {
                        nHead.getElementsByTagName('th')[0].innerHTML = '<div class="DataTables_sort_wrapper">'+lvllbl+'<span class="DataTables_sort_icon css_right ui-icon ui-icon-triangle-1-n"></span></div>';
                    },

Answers

  • matthewjmatthewj Posts: 39Questions: 2Answers: 0

    I put a console in

    "fnDrawCallback": function(oSettings) {
        console.log("fnDrawCallback:"+lvllbl)
        if(lvllbl) {
            $('span.lvllbl').html(lvllbl);
        }
    }
    

    and also in "_fnInfo": function () of dataTables.scroller.js

    else if ( dt.fnRecordsDisplay() == dt.fnRecordsTotal() )
            {
                console.log("-->"+dt.oLanguage.sInfo);
                /* Normal record set */
                sOut = dt.oLanguage.sInfo.
                        replace('_START_', sStart).
                        replace('_END_',   sEnd).
                        replace('_TOTAL_', sTotal)+
                    dt.oLanguage.sInfoPostFix;
                console.log("sOut:"+sOut);
            }
    

    It seems that fnDrawCallBack is called ahead of the function in scroller and hence I am not getting the value of lvllbl appended in sInfo.

  • matthewjmatthewj Posts: 39Questions: 2Answers: 0

    It seems that Scroller do not fire fnInfoCallBack function.
    I removed sInfo from oLanguage and added fnInfoCallBack function to pass custom info header but the Scroller did not take that instead it took the default message: Showing 1 to 10 of 10 entries

    my fnInfoCallBack function is below:

    "fnInfoCallback": function( oSettings, iStart, iEnd, iMax, iTotal, sPre ) {
        console.log("fnInfoCallback:"+lvllbl);
        return 'There are a total of '+iTotal+' <span class="lvllbl">'+lvllbl+'</span>(s).';
    },
    

    Interestingly if I remove the Scroller [By removing 'S' from sDom] the dataTable displays the info message from fnInfoCallback : There are a total of 10 Region(s).

    Hence this is very well evident that Scroller doesn't fire the fnInfoCallback. Is it an issue or bug or just that Scroller doesn't support it??

    Help!!!!

  • matthewjmatthewj Posts: 39Questions: 2Answers: 0

    I commented out lines 908 to 913 in _fnInfo function in dataTables.scroller.js 1.2.1 and then it takes the custom message from fnInfoCallback function

    else if ( dt.fnRecordsDisplay() == dt.fnRecordsTotal() )
    {
        /* Normal record set */
        /*
        sOut = dt.oLanguage.sInfo.
                replace('_START_', sStart).
                replace('_END_',   sEnd).
                replace('_TOTAL_', sTotal)+
            dt.oLanguage.sInfoPostFix;
        */
    }
    

    Therefore fnInfoCallback surely is fired but it seems Scroller is overriding it. I did few more traces and seems that below order is followed:
    fnInfoCallback
    fnDrawCallback
    fnInitComplete
    _fnInfo function in dataTables.scroller.js

    Isn't this a bug in Scroller? I would think that at least fnInitComplete or fnDrawCallback should be the last function to be called.

    I can comment out the code in dataTables.scroller.js but I am not sure of its side effects and therefore I do not want it to be done in this way.

    I just want my custom message with dynamic text to be printed on Info bar.

    Help!!!

  • matthewjmatthewj Posts: 39Questions: 2Answers: 0

    I think these lines[893 - 925] in dataTables.scroller.js is redundant. I removed these and I can see the text in fnInfoCallback. Please let me know if my finding is correct.

    if ( dt.fnRecordsDisplay() === 0 &&
                   dt.fnRecordsDisplay() == dt.fnRecordsTotal() )
    {
        /* Empty record set */
        sOut = dt.oLanguage.sInfoEmpty+ dt.oLanguage.sInfoPostFix;
    }
    else if ( dt.fnRecordsDisplay() === 0 )
    {
        /* Rmpty record set after filtering */
        sOut = dt.oLanguage.sInfoEmpty +' '+
            dt.oLanguage.sInfoFiltered.replace('_MAX_', sMax)+
                dt.oLanguage.sInfoPostFix;
    }
    else if ( dt.fnRecordsDisplay() == dt.fnRecordsTotal() )
    {
        /* Normal record set 
        sOut = dt.oLanguage.sInfo.
                replace('_START_', sStart).
                replace('_END_',   sEnd).
                replace('_TOTAL_', sTotal)+
            dt.oLanguage.sInfoPostFix;*/
    }
    else
    {
        /* Record set after filtering */
        sOut = dt.oLanguage.sInfo.
                replace('_START_', sStart).
                replace('_END_',   sEnd).
                replace('_TOTAL_', sTotal) +' '+
            dt.oLanguage.sInfoFiltered.replace('_MAX_',
                dt.fnFormatNumber(dt.fnRecordsTotal()))+
            dt.oLanguage.sInfoPostFix;
    }
    
  • allanallan Posts: 63,602Questions: 1Answers: 10,486 Site admin

    Hi,

    Yes - this looks very much like a bug in Scroller. There should also be support for _PAGE_ and _PAGES_ added (although that is probably less useful in Scroller.

    Thanks for flagging this up - I'll take a look and try to fix for the release I want to do on Monday.

    Allan

  • matthewjmatthewj Posts: 39Questions: 2Answers: 0

    Thanks Allan. I very much appreciate it.

  • matthewjmatthewj Posts: 39Questions: 2Answers: 0

    Hi Allan,

    I found one more trouble with language elements. My datatable uses scroller - I am still using the example started in this thread. This time the problem is when I put the language elements in text file it just removes all the buttons rendered by Table tools [New, Edit and several other buttons just vanishes but the language strings are correctly displayed.

    "oLanguage": { 
        "sUrl": "../dtlang.txt"
    },
    

    and below is the content of text file

    {
        "sInfo": "Total _TOTAL_ record(s) found",
        "sInfoEmpty": "No matching record(s) found",
        "sEmptyTable": "No record(s) found",
        "sZeroRecords": "No matching record(s) found",
        "infoFiltered": "(filtered from _MAX_)",
        "sProcessing": "Please wait - loading record(s) ..."
    }
    

    I am still doubtful that this behaviour could have caused by Scroller.

  • matthewjmatthewj Posts: 39Questions: 2Answers: 0

    I tried after removing Scroller by removing the 'S' from sDom but it still failed to show my TableTool buttons. Therefore is it caused by TableTool?.

    I then tried removing the "oLanguage" and all my buttons appeared and this time it shows datatable default languange strings.

    Please note I am using datatables 1.9.4

  • matthewjmatthewj Posts: 39Questions: 2Answers: 0

    Hi Allan, if this is not related should I create a separate thread for this issue?

  • allanallan Posts: 63,602Questions: 1Answers: 10,486 Site admin

    A separate thread for each issue would be good so I can track each individually. For Scroller and TableTools did your sDom option include both S and T? Can you link to a test case in the new tread please.

    I should also point out that 1.9 is no longer supported. If there are any fixes to be made in DataTables they will be in 1.10.

    Allan

  • allanallan Posts: 63,602Questions: 1Answers: 10,486 Site admin

    Fix committed. The correct way of updating the info string is with the infoCallback option (fnInfoCallback in 1.9-). The draw callback won't work, as a scroll does not necessarily trigger a draw.

    I'm just about to tag and release an updated version of Scroller. This fix will be included in it.

    Allan

  • matthewjmatthewj Posts: 39Questions: 2Answers: 0

    Thanks Allan for the fix. Should I take the fix from the Nightly build v1.2.2-dev?

  • matthewjmatthewj Posts: 39Questions: 2Answers: 0

    Regarding the second issue I have started a discussion: http://datatables.net/forums/discussion/22297/table-tool-buttons-not-rendered-when-using-text-file-for-passing-language-info-to-dt

    I think this is not related to Scroller, if I don't include both S and T, it still not rendered. Thiis happens only when we use table tool api.

  • allanallan Posts: 63,602Questions: 1Answers: 10,486 Site admin

    1.2.2 has been released now, so you can take it from there.

    I've just added a reply to your other thread.

    Allan

This discussion has been closed.