Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all articles
Browse latest Browse all 82451

Table slow on IE 8 becauses of code in fnDrawCallback

$
0
0
I have the following code. It works fine on firefox but IE8 is very slow. I have managed to identify that whatever is making IE slow is in the fnDrawCallback function. Can you help me rewrite or find out why the script gets slow? Thanks.

<script type="text/javascript">

    $(function () {
        var my_sRangeFormat = 'Enter a start date (e.g. mm/dd/yyyy) {from} Enter an end date (e.g. mm/dd/yyyy) {to}';
        var url = '<%= Url.Action("LabTableAjaxHandler", "Document") %>';

        $('#labTbl').dataTable({
            bDeferRender: true,
            bJQueryUI: true,
            bProcessing: true,
            bServerSide: true,
            bStateSave: true,
            fnStateSave: function (oSettings, oData) {
                localStorage.setItem('DataTables_labTbl', JSON.stringify(oData));
            },
            fnStateLoad: function (oSettings) {
                return JSON.parse(localStorage.getItem('DataTables_labTbl'));
            },
            fnServerParams: function (aoData) {
                aoData.push({ "name": "TableType", "value": "Lab" });
            },
            sAjaxDataProp: "aaData",
            sPaginationType: 'full_numbers',
            sAjaxSource: url,
            fnDrawCallback: function () {


                $('#labTbl tr').each(function () {


                    $(this).find('select.catagorycombo').selectmenu({
                        menuWidth: 200,
                        select: function (event, options) {

                            var td = $(this).parent().parent();

                            var combo = td.next("td").find("select.testcombo").selectmenu();

                            var url = '<%= Url.Action("GetTestListDropDown", "Document") %>';
                            var contextKey = options.value;
                            var text = $("option:selected", $(this)).text();
                            var length = combo.find('option').length;
                           
                            $.ajax({
                                type: "POST",
                                url: url,
                                data: { contextKey: contextKey, catagory: text },
                                success: function (data, textStatus, jqXHR) {
                                    var options = [];
                                    $.each(data, function (i, el) {
                                        options.push("<option value='" + el["Value"] + "'>" + el["Text"] + "</option>");

                                    });
                                   
                                    combo.append(options.join("")).selectmenu();
                                    combo.selectmenu('enable');
                                }
                            });

                        }
                    });

                    $(this).find('select.testcombo').selectmenu({
                        menuWidth: 200
                    });


                });

            },
            aoColumnDefs: [
        { aTargets: [0], bSortable: false, mDataProp: function (aaData) {

            var display_value = '<a href="#" class="doclist-view-detail">View</a>';
            return display_value;
        }
        },
        { aTargets: [1], sType: 'date', mDataProp: function (oObj) {
            return formatJsonDate(oObj[0], 'MM/DD/YYYY hh:mm');
        }
        },
        { aTargets: [2], mDataProp: function (oObj) { return oObj[1] } },
        { aTargets: [3], mDataProp: function (oObj) { return oObj[2] } },
        { aTargets: [4], mDataProp: function (oObj) { return oObj[3] } },
        { aTargets: [5], bSortable: false, mDataProp: function (oObj) {

            var r = '<div class="pcatagorycombo"><select class="catagorycombo"  style="width:120px;" ><option value="' + oObj[4] + '">Select All</option></select></div>';
            return r;

        }

        },
     { aTargets: [6], bSortable: false, mDataProp: function (oObj) {

         var r = '<div class="test"><select class="testcombo" disabled="disabled" style="width:120px;"><option value="' + oObj[4] + '">Select All</option></select></div>';
         return r;
     }

     }
    ]
        })
        .columnFilter({
            sPlaceHolder: 'head:after',
            aoColumns: [
            null,
            { type: 'date-range', sRangeFormat: my_sRangeFormat, displayBlock: true, showLabels: false, showToolTips: true },
           { type: "text" },
           null,
           null,
           null,
           null
]
        }).fnSetFilteringDelay();


    });


$('body').on('click', '.pcatagorycombo', function (e) {

    var url = '<%= Url.Action("GetCatagoryListDropDown", "Document") %>';
    var combo = $(this).find('select.catagorycombo').selectmenu();
    var contextKey = combo.val();
    var length = combo.find('option').length;
    var loading = "<option value='Loading'>Loading...</option>";
   
    if (length == 1) {
        combo.append(loading).selectmenu();
        $.ajax({
            type: "POST",
            url: url,
            data: { contextKey: contextKey },
            success: function (data, textStatus, jqXHR) {
                var options = [];
                $.each(data, function (i, el) {
                    options.push("<option value='" + el["Value"] + "'>" + el["Text"] + "</option>");

                });
                combo.find('[value="Loading"]').remove();
                combo.selectmenu();
                combo.append(options.join("")).selectmenu();
            }
        });

    }
    else {
        return false;
    }



});

$('body').on('click', '.doclist-view-detail', function (e) {

    var catagoryCombo = $(this).closest('tr').find('.catagorycombo');
    var testCombo = $(this).closest('tr').find('.testcombo');
    var contextKey = catagoryCombo.find('option:selected').val();
    var catagory = catagoryCombo.find('option:selected').text() == "Select All" ? "all" : catagoryCombo.find('option:selected').text();
    var test = testCombo.find('option:selected').text() == "Select All" ? "all" : testCombo.find('option:selected').text();
    var url = '<%= Url.Action("detailslab", "document") %>/lab?contextKey=' + contextKey + '&catagory=' + catagory + '&test=' + test;

    window.location = url;

});

                       
</script>


Viewing all articles
Browse latest Browse all 82451

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>