Chris
Chris

Reputation: 103

Jquery + ASP.NET UpdatePanels

I've been busily implementing JQuery throughout our custom CRM at work. In the process I create a bordered panel, which has the a simple button in it's header which collapses or expands the contents depending on what it's current state is. Now to remember the state of the panel I'm using the jquery cookie library, which when the page is submitted sets a cookie for that control, and then when the page is reloaded it reads and resets the panel to it's last state.

Problem one was getting JQuery to execute on the submit of the page, because ASP.NET takes over this and wouldn't call the submit() functions on the form. To overcome this, I found http://kenbrowning.blogspot.com/2009/01/supporting-jquerys-formsubmit-in-aspnet.html which seemed to work almost flawlessly.

However... After further testing, I've discovered that this will prevent any postbacks that are meant to occur within an UpdatePanel, to do a full Postback, instead of Async one from the panel. I realise UpdatePanels are a little out-dated now, but they are littered throughout our site, so in order to use this control it will have to work nicely with them.

So, is there anyway of determining if an async postback has taken place?? Basically I want to be able to do something like this:

if (IsAsyncPostback) {
    theForm.submit(); //this seems to still fire the async postback, but doesn't call the jquery which is setup to save the state..
} else {
    $(theForm).submit(); //this is from the link, which cause all postbacks to be full on postbacks, even if they are in an updatepanel
}

Help, I've searched around and haven't been able to find anything useful.. Sure I can't be the only person who has tried this?

Upvotes: 3

Views: 809

Answers (2)

Dave Ward
Dave Ward

Reputation: 60570

I would avoid interfering with the __doPostBack() function.

I think what you want is to handle the PageRequestManager's beginRequest or endRequest events. This will run your code after every UpdatePanel refresh, for example:

var prm = Sys.WebForms.PageRequestManager.getInstance();

prm.add_endRequest(function() {
  if ($('#panelID').is(':hidden'))
    $.cookie('#panelID', 'true');
  else
    $.cookie('#panelID', 'false');
});

If you really wanted to change __doPostBack(), it would be better to do so with this sort of approach:

var oldDoPostBack = window.__doPostBack;

window.__doPostBack = function(target, arg) {
  // Trigger a custom event, to track when this occurs.
  $(window).trigger('doPostBack');

  // Call the real __doPostBack() function;
  oldDoPostBack(target, arg);
}

Then, you could bind to that custom event to take actions when __doPostBack() was triggerd from any source:

$(window).bind('doPostBack', function() {
  alert('__doPostBack is about to execute.');
});

The important advantage here is that you aren't redefining __doPostBack(), so there's less chance that you'll break it.

I'd recommend sticking with the built-in PageRequestManager events though, unless you really do need to catch __doPostBack() events for some other reason.

Upvotes: 2

Ben
Ben

Reputation: 3912

Have you seen this: http://msdn.microsoft.com/en-us/library/ms178208.aspx ?

Upvotes: 0

Related Questions