Databases
StackOverflow2013
Postsdbo
POjQuery 1.7.2 \IE9 ajax Invocation Not Clearing Discarded Elements
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery 1.7.2 \IE9 ajax Invocation Not Clearing Discarded Elements
    text
    copied!<p>I've been wrestling with the following issue for most of the day and have made absolutely zero headway so thought i'd reach out to see if anybody has some ideas (help!!!). I'm currently using jQuery 1.7.2 in conjunction with IE9 and am invoking a simple $.ajax call which simply retrieves some HTML. The HTML is subsequently inserted into a div as follows:</p> <p><code>$("#viewContent").html(content);</code> </p> <p>the complete relevant jQuery code is shown below:</p> <pre><code>var request = $.ajax({ url: loadUrl, type: "GET", cache: false, data: {command: "loadView", recordid: contextId}, dataType: "html", error: function (xhr, ajaxOptions, thrownError) { getViewManager().setMode("ERROR"); handleError(xhr.status, thrownError); $("#viewContent").parent().removeClass("ajaxLoading"); } }); request.done(onLoadViewSuccess); var onLoadViewSuccess = function(content) { $("#viewContent").parent().removeClass("ajaxLoading"); for(var i=0;i&lt;100;i++) { $("#viewContent").html(content); } content = null; } </code></pre> <p>Now as to the issue, you'll notice i've inserted the content 100 times, the for loop is intended only to exaggerate the climbing memory (observed via Drip memory profiler for IE) which climbs (along with the total number of DOM nodes retained by IE). The content isn't an issue as I replaced it with a static empty string and it does the same thing within the onLoadViewSuccess function: </p> <pre><code>var onLoadViewSuccess = function(content) { $("#viewContent").parent().removeClass("ajaxLoading"); for(var i=0;i&lt;100;i++) { $("#viewContent").html("&lt;div/&gt;"); } content = null; } </code></pre> <p>i.e. Drip will show 100 new DOM nodes after each ajax call and steadily climbing memory. Now as to why this appears to be something up with the ajax call, if I call the same method on the initial page load:</p> <p><code>$(document).ready(function() {onLoadViewSuccess("&lt;div/&gt;")});</code> </p> <p>I don't see the same behavior (i.e. invoking html("&lt;div/&gt;") each iteration within the for loop is properly clearing the replaced DOM node within IE9 as opposed to creating 100 new ones and keeping them all in memory...I've reviewed several reported issues with IE and jQuery's ajax functionality, but the only topics which come close appear to be related to older IE versions which have since been addressed in previous versions of jQuery...</p> <p>I suspect i'm missing something fundamental as this seems to be such a trivial use-case and typically when I can't find any similar topics via google, 9 out of 10 times its due to something foolish on my part...</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload