UpdatePanel + window.resize + datatables.js again...

UpdatePanel + window.resize + datatables.js again...

narslankayanarslankaya Posts: 3Questions: 1Answers: 0
edited April 2017 in Free community support

Hello,

UpdatePanel replaces elements after post. With add_load method, I solved problem by reinit datatables.js. But after some tests found that, elements removed, but some objects and event handlers remain live. Thats why resize event handler invoked second time. First one removed element, so error occuring and the second one isnot invoked. If you put try catch, invoked again for new table. I modified resize handler as fallows:

// I take handlers pointer to enable unbind.
var handler= _fnThrottle(function() { 
    if (oSettings.nTable==null || oSettings.nTable.rows == null || oSettings.nTable.rows.length == 0) {
       oSettings.oInstance.fnDestroy(true);
       $(window).unbind("resize.DT-" + oSettings.sInstance, handler);
       return;
     }
    _fnAdustColumnSizing(oSettings);
});

$(window.bind('resize.DT-' + oSettings.sInstance, handler);

Current state, problem solved. But there is another problem. Old instance allready live and kept on memory. So after some work memory leaks and browser become unstable. fnDestroy(true) is not complete destroy dom objects and memory does not freed.

I looked for another solution at update panel js codes but not found. ondestroy event does not work.

Does anyone has solution for this memory leak?

datatables
UpdatePanel
resize event

This question has an accepted answers - jump to answer

Answers

  • narslankayanarslankaya Posts: 3Questions: 1Answers: 0

    Datatables with update panel has serious problems. If has multiple updatepanel which one posted or which is updated undefined and no way to findout. with add_load method its imposible to determine grid will be modified. With the previous code block prevent resize event problems.

    After some inspection of .net js resources, i found that an element with dispose method selected and invoked dispose method for disposing. I added simply following code and solved problem.

    var mytable = $("#myTable").DataTable(opts);
    // any js component placed in an update panel it works
    $("#myTable_wrapper")[0].dispose=function(){ myTable.destroy(); };
    
    

    updatepanel
    js components
    .net
    asp.net
    dispose

  • allanallan Posts: 63,535Questions: 1Answers: 10,475 Site admin
    Answer ✓

    Hi,

    Could you tell me what UpdatePanel is please? Is it another jQuery library or something built into .NET or something else?

    Good to hear you have a workaround though.

    Allan

  • narslankayanarslankaya Posts: 3Questions: 1Answers: 0

    asp.net updatepanel control is a kind of ajaxtoolkit control. Converts page posts to ajax calls. When post requested only updatepanel content is modified. The throubles start there. Jquery objects, javascript controls like datetimepicker, datatable.js dom objects removed and new objects attached. So events and dom element references become void. I modified gridview control to render datatables.js object. But when page resized or old object methods called gets exception. Because of object references not released, memory leak occurs. I inspect updatepanels javascript files. found that it looks for dispose method of dom elements. Implementing dispose makes page more stable.

This discussion has been closed.