Memory Leak with jQuery UI inside UpdatePanel in ie7

Posted by Ryan on Stack Overflow See other posts from Stack Overflow or by Ryan
Published on 2010-02-06T17:37:17Z Indexed on 2010/06/14 12:02 UTC
Read the original article Hit count: 250

I have a fairly complex asp.net page based on UpdatePanels and jQuery UI. Unfortunately, when the panels update, the jQuery UI widgets leak memory like crazy in ie7, even if I manually 'destroy' them. Does anyone know a technique/patch to prevent these leaks? I've created a simple example page with a slider inside an UpdatePanel. Just click the 'Leak' button and refresh the page to see the leak in sieve.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Leak2.aspx.cs" Inherits="Leak2" %>
<%@ Register Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" Namespace="System.Web.UI" TagPrefix="asp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Leak</title>
    <link type="text/css" href="/jquery/css/custom-theme/jquery-ui-1.7.2.custom.css" rel="Stylesheet" />   
    <script type="text/javascript" src="/jquery/js/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="/jquery/js/jquery-ui-1.7.2.custom.min.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <script type="text/javascript">
            function initializeSlider() {
                $(".slider").slider({
                    min: 0,
                    max: 100,
                    value: 100,
                    step: 5
                });
            }
            $(document).ready(function() {
                initializeSlider();
                Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function() {
                    initializeSlider();
                });
            });
        </script>
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <div style="width: 300px;">
                    <div class="slider"></div>
                    <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Leak" />
                </div>
            </ContentTemplate>
        </asp:UpdatePanel>

    </div>
    </form>
</body>
</html>

© Stack Overflow or respective owner

Related posts about ASP.NET

Related posts about jquery-ui