8 people following this project (follow)

Project Description
Allows developers using the .Net Framework and MS AJAX to interact with UpdatePanels using jQuery.

The UpdatePanel plug-in for jQuery (http://jQuery.com) allows developers using the MS Ajax post back model and jQuery a simple event model to bind jQuery selectors to content located inside a UpdatePanel.

I wrote this plug-in before jQuery introduced .live events or .delegate. I really suggest you look into these as alternatives as they will perform much better.

Functions:
  • .panelCreated(fn) - called when the UpdatePanel is created on a page
  • .panelUpdated(fn) - called when the panel is updated during a asynchronous (ajax) postback.
  • .panelReady(fn) - called when the UpdatePanel is first created or updated.
  • .beginRequest(fn) - called before the processing of an asynchronous postback starts and the postback request is sent to the server.
  • .initializeRequest(fn) - called during the initialization of the asynchronous postback. Allows the cancellation of the request.

Usage:

$(document).ready(function() {

    //Place jQuery code here for elements selected outside the update panel
    $('#UpdatePanel1').panelReady(function() {
        //Place jQuery code here for elements selected inside the update panel
        $('#Button1').click(function() {
            alert('button clicked!');
        });
    });
});

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
    <asp:Button ID="Button1" runat="server" Text="Button1" /><br />
    <asp:Label ID="Label1" runat="server" Text="Label1"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>

Last edited Nov 4 2011 at 3:18 PM by JamesWestgate, version 13