Showing posts with label call. Show all posts
Showing posts with label call. Show all posts

Saturday, March 24, 2012

Confirm Extender + Modal Popup -> Call JavaScript on the load, and exit.

I have a Confirm Extender workign with a modal popup extender.

What I'd "like" to do is when the button that launches both is clicked, to run some client script to populate some fields. This saves me from doing it on the server. however, even using OnCLientClick on the button initiating all of this it doesn't work.

Any thoughts?

Also, when I click the OK button close the modal popup confirm box.. .(say that 10x as fast as you can), it would be better for it to close right away, rather than close when the server is done processing.

Is it possible to run script before it hits the server to make the display:none; again?

Hi RTernier,

RTernier:

What I'd "like" to do is when the button that launches both is clicked, to run some client script to populate some fields. This saves me from doing it on the server. however, even using OnCLientClick on the button initiating all of this it doesn't work.

Here is a workable example which you can compare with yours.

<%@. Page Language="C#" %><%@. Import Namespace="System.Threading" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"> protected void Page_Load(object sender, EventArgs e) { Thread.Sleep(3000); }</script><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title> <style> .modalBackground { background-color:Gray; filter:alpha(opacity=70); opacity:0.7; } .modalPopup { background-color:#FFD9D5; border-width:3px; border-style:solid; border-color:Gray; padding:3px; width:250px; } </style></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager><%=DateTime.Now.ToString()%> <asp:Button ID="Button1" runat="server" Text="Button" /><ajaxToolkit:ConfirmButtonExtender ID="ConfirmButtonExtender1" runat="server" TargetControlID="Button1" DisplayModalPopupID="ModalPopupExtender1" > </ajaxToolkit:ConfirmButtonExtender> <asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" Style="display: none"> Are you sure? <asp:Button ID="btnOk" runat="server" Text="Ok" /> <asp:Button ID="btnCancel" runat="server" Text="Cancel" /> </asp:Panel> <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Button1" PopupControlID="Panel1" CancelControlID="btnCancel" BackgroundCssClass="modalBackground" OkControlID="btnOk"> </ajaxToolkit:ModalPopupExtender> <script type="text/javascript" language="javascript"> function pageLoad(){ $find("<%=ModalPopupExtender1.ClientID%>").add_showing(onMPEShowing); } function onMPEShowing(){ //your javascript code here to add fields or do anything what you want. } </script> </form></body></html>

RTernier:

Also, when I click the OK button close the modal popup confirm box.. .(say that 10x as fast as you can), it would be better for it to close right away, rather than close when the server is done processing.

Is it possible to run script before it hits the server to make the display:none; again?

It will be hidden right after be clicked. Please see my sample

Hope this helps.

Best regards,

Jonathan


I can not say how grateful I am for this solution. Wanted same functionality in my app.

I have 1 question though. Is there any client script reference for methods like add_showing etc. I also wanted to do some client side scripting on modal popup closing ..and i just guessed the function (must be my luck day) add_hiding..which worked beautifully!

However, I would still love a client side script reference for the same. Please advise. Thanks!

Wednesday, March 21, 2012

Compare the page size of a control with AJAX call to without it

Hi,

I would like to capture the difference of a page' size (resulted from HTML markup sent to client) between a control with AJAX and without it, that is postback.

Could any give me suggestions about how to implement this function or tools can help me doing that.

Any suggestion would be appreciated.

Ricky.

If you're interested in just viewing the size differences, you could try using a utility like Fiddler, which will report back to you the size of the HTTP responses. Fiddler provides a lot of additional info that is useful to web developers - I'd highly recommend it.

Fiddler(v2)


u could try this...

with page on browser, save on your hard disk the source html (view/html from IE)

then do the same with the control without AJAX.

or viceversa.

the sizes of two files give you the idea.

:)


gmastro:

with page on browser, save on your hard disk the source html (view/html from IE)

then do the same with the control without AJAX.

This won't give you a true idea of the difference in sizes. When you use AJAX, you'll load scripts from external files using ScriptResource.axd and WebResource.axd. Those scripts will load, but in the source html, you will just see:

<script src="/Project/WebResource.axd?d=JIj7eF1JuZPjL4hPGAVvsg2&t=633059383787628338" type="text/javascript"></script>
And you'll miss the true impact, size-wise, of using AJAX.

Use Fiddler to compare page sizes for yourself... I would suggest reading this article first...

http://msdn.microsoft.com/msdnmag/issues/07/06/WickedCode/


Hi, guys.

Thanks for yours enthusiastic replies.

Ricky.