PostBack Ritalin
PostBack Ritalin is an ASP.NET AJAX server control to help simplify the common task of disabling buttons in UpdatePanels during partial postbacks (and automatically re-enabling them afterward).
PostBack Ritalin depends on the ASP.NET AJAX extensions. If you’re using ASP.NET 3.5, you’re all set. If you’re using ASP.NET 2.0, make sure you have the AJAX extensions property installed and configured before attempting to use PostBack Ritalin.
Properties
WaitText (optional): String value specifying replacement text for any Button controls, displayed only during partial postbacks (e.g. “Please Wait”, “Processing…”, etc). If omitted, defaults to “Processing…”.
WaitImage (optional): String value specifying an alternate image URL to be displayed during partial postbacks. If this is not specified, ImageButtons will be functionally disabled, but visibly unchanged during partial postbacks.
MonitoredUpdatePanels (optional): An optional collection of UpdatePanels to monitor. If specified, then only the specified UpdatePanels will activate PostBack Ritalin. If omitted, any UpdatePanel on the page will active PostBack Ritalin. See usage example and sample website for syntax.
MonitoredUpdatePanel Properties
UpdatePanelID: The control ID of the UpdatePanel to monitor.
WaitText (optional): Same functionality as the master WaitText, but specific to the particular UpdatePanel specified by UpdatePanelID.
WaitImage (optional): Same functionality as the master WaitImage, but specific to the particular UpdatePanel specified by UpdatePanelID.
Usage examples
Basic usage. In the following example, when Button1 is clicked, its text will be replaced with “Processing…”, it will be blurred, and it will be disabled. When the partial postback completes, it will revert to its previous state.
<asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <asp:Button ID="Button1" runat="server" Text="Click Me" OnClick="Button_OnClick" /> </ContentTemplate> </asp:UpdatePanel> <encosia:PostBackRitalin runat="server" />
Example of using the MonitoredUpdatePanels collection to restrict PostBack Ritalin to only activate on events triggered from certain UpdatePanels. In the following example, only events from UpdatePanel1 will cause Button1 to be disabled during partial postbacks. Events occurring in UpdatePanel2 will be unaffected.
<asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <asp:Button ID="Button1" runat="server" Text="Click Me" OnClick="Button_OnClick" /> </ContentTemplate> </asp:UpdatePanel> <asp:UpdatePanel ID="UpdatePanel2" runat="server"> <ContentTemplate> <asp:Button ID="Button2" runat="server" Text="Click Me" OnClick="Button_OnClick" /> </ContentTemplate> </asp:UpdatePanel> <encosia:PostBackRitalin ID="PostBackRitalin1" runat="server"> <MonitoredUpdatePanels> <encosia:MonitoredUpdatePanel UpdatePanelID="UpdatePanel1" /> </MonitoredUpdatePanels> </encosia:PostBackRitalin>
Download
PostBack Ritalin v0.9 (19 KB)
Changelog
v0.9 (1/30/2008)
- Resolved all remaining issues with master pages. Nested naming containers should no longer cause any issues.
- Added the ability to provide UpdatePanel specific WaitText and WaitImage properties for each MonitoredUpdatePanel.
- Added correct handling for virtual paths in all WaitImage properties.
- Added CSS to change cursor style to “wait” when hovering over the disabled control.
- General improvements to client side code.
v0.8 (1/13/2008)
- Removed Toolkit dependency (no more build mismatches!).
- Added MonitoredUpdatePanels collection, to control which UpdatePanels events are handled for.
- Potentially fixed master page issues.
v0.5
- Updated build to target the latest Toolkit (11119).
v0.4
- Updated build to target the latest Toolkit (10920).
v0.3
- Updated build to target latest Toolkit (10618).
v0.2
- Added WaitImageURL, to better support ImageButton controls that raise postbacks.
- Added a check to ensure that the control raising the postback is either an ImageButton or Button type, to clear up some issues with submitting a form with enter while a Textbox is focused.
- Added a check to make sure the control that raised the postback still exists after the postback completes, in case the newly updated div no longer contains that element (e.g. a form that transitions to a confirmation message)
v0.1
- Initial release
Comments
Hi Dave,
I really like this control but I’m having one problem. My panel and button are on a content page and after the postback the button’s text displays as ‘undefined’. Any way to fix this?
Thanks!
I’m not sure what would cause that. Is the page in a location where I can take a look at it and run it through FireBug?
Hi Dave,
Sorry it took awhile to get back to you but I’m still trying to work with this. Here’s a simple example that can replicate it the button text being set to undefined.
protected void Button_OnClick(object sender, EventArgs e)
{
UpdateGrid.Update();
}
How about some instructions to install? I tried adding it as a custom control but I get the message “Could not load file or assembly ‘AjaxControlToolkit’ … the system cannot find hte file specified”. I do have the toolkit installed, I’m currently using it throughout the site.
I’ve had a few people run into that “Could not load assembly” error. It’s something to do with a mismatch between the build of AjaxToolkit that I built my control against, and the build that you’re running.
What build are you using on your site?
I have the same problem, I’m 99% sure it is caused because a few days after you release this version of Ritalin they released a new version of the toolkit. This control is dependent on the second latest version of the ajax control toolkit. If someone can post a download for it that would be awesome.
The download version is compiled against the latest toolkit now. Try it again.
Thanks Dave! :D
Hi Dave,
Thanks for the quick response. Here’s a link to the page. If you login with ‘dave’ and click ‘Employees’ you will see a search button. Once it is clicked it reads ‘undefined’.
http://asteryx.com/rbsdemo/Default.aspx
Thanks for the help!
Hi there,
I added a reference to your dll and added this on my page:
However, it’s throwing the error Namespace unknown (Assembly missing?)
Your dll is correctly referenced and is inside my Bin folder.
What could be wrong? Thanks!
Usually, that error indicates a mismatch in the version of the AjaxToolkit in your project and the version that the control extender is built against. Make sure your project references the latest Toolkit build (10618).
Hello, I am getting the error:
“Extender control ‘PostbackRitalin1′ cannot extend ‘AddToListButton’. Extender controls of type ‘Encosia.PostbackRitalin’ cannot extend controls of type ‘System.Web.UI.WebControls.ImageButton’.”
I was under the impression that this control extender was able to function with imagebuttons. Is this correct?
Also, I downloaded the control and the properties state that is version 2.0.0. How do I know if I have the latest build?
Use the containing UpdatePanel as your TargetControlID. The control will do the rest, anytime an ImageButton or Button control raises a partial postback in that UpdatePanel.
I am using a 3rd party UpdatePanel. So I didn’t think that would work…and it didn’t. Thanks for the try though!
There is no way to extend it to the image button?
Unfortunately, the current version isn’t very adaptable to that scenario. Soon, I’m going to change it to be a standalone control with more flexibility than the Toolkit Extender allows.
For now, you might consider handling the pageRequestManager’s initializeRequest and endRequest events to achieve the same result. Take a look at my CSS style as AJAX progress indicator post for an example of how to do this.
Thank you! I was able to follow the same line of reasoning that you described, except using the object model of the 3rd party control I am using.
Good stuff!!
Why don’t you integrate this into the AJAX control toolkit? This is good concept and the masses should get this with a simple download of the AJAX control toolkit.
I think I’m probably going to go the other way with it and make it standalone. The Toolkit dependency has caused me no end of headache.
im trying to download the “postback retalin” it wont download i wish you to fix this problem.
2- can “postback retalin” help me with (DragPanelExtender):
im trying to keep the object position when i drag it with DragPanelExtender , but on refresh or postback it return to the orginal position.
any help would be good for me
thanks
Sorry about that. You caught me in the middle of switching hosting. The download will work now.
I don’t think this control can help with the scenario you describe.
Hi
I tried to use the control and it works fine with one update panel.
but if I’m using 2 update panels, even though I’m targeting one of them, I get the same behaviour (of disabling) for the buttons in the other update panel.
here is a simple example code:
p.s. I’m using master page (if it makes any difference) and using the latest ajax build.
Thanks in advance,
Shlomi
What it actually does is catch the ID of whatever control triggers the partial postback, and disable it regardless of where the postback originated.
Unfortunately, I wasn’t able to locate the TargetControlID property of the extender base, in order to only process postbacks originating from the target. I’ll put that on the list of features to add when I convert it to a regular control, instead of using the Toolkit.
Hi Dave,
thanks for your fast reply.
So what I understand is that TargetControlID has no meaning now, right?
Can you estimate when you’ll have it done? we want to know if we can rely on your solution (which really fits us best!)
Thanks again,
Shlomi
That’s correct. TargetControlID is part of the Toolkit’s control extender base, or the property wouldn’t even be there. It currently does nothing, in my control.
Realistically, it will probably be a couple weeks before I have a chance to rewrite the control.
If you’re in a hurry, you could write your own client script to emulate its behavior. The code used in my CSS progress indicator example works the same way that this control does.
Thanks.
I hope I’ll find time to do that.
If you do implement this feature, please let me know..
I’m have a problem when use ModalPopupExtender, when Click in Button of TargetControlID a exception is throw.
Hi, it’s a great extender, but can you also support the linkButtons? I’d appreciate if I could also see the source code…
I believe adding LinkButton support would be pretty easy. I’ll put that on my list of things to do.
For those of us not using Visual Studio, what does the Assembly registration look like for your control?
Like so:
Thanks. Worked like a charm.
Another question. Does the WaitImageURL property only apply for image buttons? The behavior I was expecting was for my button to be replaced by a waiting image.
Yes, it only uses the image replacement if the control that raises a partial postback is an ImageButton control.
Dave
This extender is great! But I think I might have found a bug. I’m trying to use it with an ImageButton, and it seems that the WaitImageURL property isn’t acting as intended. I debugged with FireBug and found this code:
_partialUpdateBeginRequest : function(sender, e)
{
$get(e._postBackElement.id).disabled = true;
if (e._postBackElement.type == “submit” && this._WaitTextValue != “”)
{
this._oldValue = $get(e._postBackElement.id).value;
$get(e._postBackElement.id).value = this._WaitTextValue;
}
else if (e._postBackElement.type == “image” && this._WaitImageURL != “”)
{
this._oldImageURL = $get(e._postBackElement.id).src;
$get(e._postBackElement.id).src = this._WaitImageURLValue;
}
}
Should that else if contain (e._postBackElement.type == “image” && this._WaitImageURLValue != “”) instead? this._WaitImageURL is undefined while this._WaitImageURLValue matches up with the WaitImageURL property.
You’re absolutely right. I have no idea how that slipped through the cracks. Thanks for pointing it out to me.
I just uploaded a corrected version.
Awesome, thanks!
Hi Dave,
I’d like to try your extender but I’m using the newest version of the toolkit (10920), which I don’t believe your extender will work with.
Any chance you’ll be updating to the latest toolkit build?
Thanks,
Bill
It’s built against the latest version of the Toolkit. I just decided to stop adding individual changelog entires for build updates.
Sorry for the confusion.
Hi Dave,
When I try to add your control into my toolbox I receive the following error:
“There was an error loading types from assembly ‘c:\mypathtocontrol\PostbackRitalin.dll’
‘Could not load file or assembly ‘AjaxControlToolit, Version=1.0.10920.32880, Culture=neutral, PublicKeytoken=28f01b0e84b6d53e’ or one of its dependencies. The system cannot find the file specified.’”
I checked and my version of the Ajax Control Toolkit is 10920. I’m running VS 2005 Pro. Also the toolkit I downloaded has a file version of 0.2.0.0, is that correct?
Any help would be most appreciated.
Sorry, I meant your control was showing a file version of 0.2.0.0, not the toolkit.
The 0.2 displayed assembly version was just a case of my not remembering to update the AssemblyInfo when I built the last version.
I double checked, and my project is built against 10920. I bumped the assembly version to 0.4, rebuilt clean, and replaced the download version with that.
Give it a try.
Works like a charm, thanks Dave!
No problem. Sorry for the mix up.
No need to apologize, it was my fault. I was trying to add it to my toolbox thinking it was a control, instead of adding it to my References.
AjaxControlToolkit version 11119 is released.it is better to add the project source so developer can use it as the AjaxControlToolkit version is updated.
It’s updated for 11119.
i read you component source with Reflector;no source change is needed for updating the AjaxControlToolkit;you should just update the dll.
you can also provide a [Editor(”System.Web.UI.Design.ImageUrlEditor, System.Design, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a”, typeof(UITypeEditor))] attribute for WaitImageURL to add a better design time support for setting the image.
thanks for your great component too.i saved me a lot of developing tasks and support efforts.
That’s all I do (update the toolkit reference in my project and rebuild it to produce a extender dll that references the latest build). I wish there were some way I could decouple it from that build dependency, since it’s pointless for what my extender does.
I’ll look into doing that to add design time support for the WaitImageURL. Thanks for the suggestion.
I have a preliminary version of the rewritten version of this completed. The toolkit dependency is removed, and it correctly respects the list of UpdatePanels that it is given to monitor for events.
If anyone wants to help me test it, get in touch with me through the contact form and I’ll email you a copy of it.
Updated to version 0.8.
Massive changes this version, including removal of the Toolkit dependency and properly being able to target only certain UpdatePanels.
Give it a try and let me know what you think.
Is that possible to use imagebutton within monitored update panel like:
I tried this but it’s not working. If I remove the monitoredupdatepanel, it works like a charm. Any idea?
Thanks,
Try that again with <pre lang=”asp”></pre> around the code.
My problem is that I have three update panels and I’d like to use a different image for each panels. So my idea was having three monitored update panel with different image in it. and I used the following code:
encosia:PostBackRitalin ID=”PostBackRitalin1″ runat=”server” WaitImage=”/App_Themes/NaturalForme/Images/waits.gif”
MonitoredUpdatePanels
encosia:MonitoredUpdatePanel UpdatePanelID=”upSubscribe” /
/MonitoredUpdatePanels
/encosia:PostBackRitalin
How about if I add a WaitText and WaitImage property to the MonitoredUpdatePanel, so that you could specify it for each one in the collection?
That would be excellent!!! Thanks
Updated to version 0.9. The new version adds a couple new features and a couple bugfixes, thanks to Chris’ feedback. Thanks, Chris!
Hi
Great control, however the text in the button only seem to change back the first time, all subsequent clicks it disables ok but text is always “Processing…” (or what ever i set WaitText to be)
Any idea what i’m doing wrong?
Can I take a look at the page it’s on, or could you email it to me?
Support for LinkButtons would be great.
That shouldn’t be difficult. I’ll add it in the next build.
Hi,
args.get_postbackBackElement() can return null in which case asking for the type gives a null reference (using v0.9)
And so can sender._postBackSettings.sourceElement
Excellent, works great right out of the box Thanks!
Hi the ajax control toolkit is updated.
thanks for attention.
This isn’t dependent on the Toolkit anymore. The current download should work with any Toolkit version.
Dave, any plans to release the source or add support for LinkButton. We use as many link buttons as regular ones. Thanks!
LinkButtons are something I plan on handling, but I haven’t decided how best to do it. Since <a> elements don’t have a disabled property, it’s a bit more tricky than with regular buttons and image buttons.
Dave, the control works fine, however, when in design view, the controls on the page do not render and an error is displayed. It reads, “Error Creating Control - Content1 ‘encosia:PostBackRitalin’ could not be set on property ‘MonitoredUpdatePanels’.
This isn’t a problem for me, but the designers on my team are complaining. Do you know what is causing this. This is within a master page. Thanks!
I have to confess I rarely remember to test my controls in design view, because I never use it myself.
It’s probably something minor. I’ll take a look at it and get it fixed.
I haven’t been able to reproduce this. Could you email me a representative site/project?
Thanks, Dave.
I’m using your control on the page within the master page with only one UpdatePanel.
The control works fine when I use MonitoredUpdatePanels collection - but I’m getting the same error msg in the design view as Brian above (Error Creating Control - Content1 ‘encosia:PostBackRitalin’ could not be set on property ‘MonitoredUpdatePanels’).
When I use the control without MonitoredUpdatePanels collection (Basic usage) the control does not work.
You can safely ignore that error. It doesn’t actually affect anything.
If you’d like a pre-release build that fixes that, send me an email that I can reply to with the attachment.
Do you have any plans to implement “Sorting” on gridviews?
Example, I have a search form. Clicking the button triggers the event, but columns sorting does not trigger this to lock the button.
Do you have any instructions on how to do this or plans to implement this into the control?
That should be possible when I add LinkButton disabling to it in the next build. It’s just a bit problematic to implement since I can’t disable <a> elements the same way as Buttons and ImageButtons.
Should be coming soon.
Nice work so far.
I have a problem with the new CSS cursor changes in 0.9. On a button click, if the code being called in the button click event handler and an exception is thrown I would like the user to be able to click the button again (i.e. it returns to its original state). At the moment the text reverts and button becomes enabled, but the cursor does not change back to an arrow and remains an hourglass.
Long story short, is it possible to remove this change
Added CSS to change cursor style to “wait” when hovering over the disabled control.
or at least provide a way to disable it?
When is the next version to be released?
To be honest, I think that option was a lot better in theory than practice. It’s such a small area affected, the pointer change isn’t very useful anyway.
I’m going to remove that feature. I’m not quite ready to release the next build yet, but I’ll email you a version with that option removed later this afternoon.
I tried to email the updated version to the address you submitted with the comment, but it bounced. Email me a good address to use for you and I’ll send you the updated version.
Try the email for this post, thanks.
Thanks for that. I tried out your fix, seems to be working fine. Only issues I’m having now is that the assembly is not signed, and can’t be used in a project that is signed. Also, is there a way to make it not change the button text but only disable it.
Sometimes if an exception has occurred, the text does not revert back to the original text but still says “Processing…”, even though the button is reenabled and fully functional otherwise.
There’s probably not much I can do about that. If you’ve got an unhandled exception that prevents EndRequest from running, my code doesn’t get another chance to run.
I have noticed another issue. I have a set of navigation buttons to navigate through pages of an asp:MultiView. The next button is disabled on the last page, and the previous button is disabled on the first page. When the Postback Ritalin extender is applied, the enabled state is overriden with true. i.e. The next/previous buttons are always enabled after clicking on them once. Obviously, a workaround would be to put them in a separate update panel, but its not exactly elegant.
Can you email me a representative sample? I’ll check it out.
Eventually… It’s going to take me a while to find some spare time and then decouple everything so that it’s standalone.