Going For AJAX: code

Showing posts with label code. Show all posts

Monday, March 26, 2012

How Do I Dynamically Load Pages Into An UpdatePanel

My code is as follows:

<%@dotnet.itags.org.PageLanguage="VB"AutoEventWireup="true"CodeFile="AnyModule1.aspx.vb"Inherits="_Default" %>
<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.1//EN""http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
<title>My Module</title>
</head>
<body>
<formid="form1"runat="server">
<asp:ScriptManagerID="ScriptManager1"runat="server">
<Scripts>
<asp:ScriptReferencePath="WebRequest.js"/>
</Scripts>
</asp:ScriptManager>
<divstyle="text-align: center">
<tableborder="0"cellpadding="0"cellspacing="0"style="width: 100%">
<tr>
<tdalign="left"style="width: 100px">
<asp:MenuID="Menu1"runat="server"BackColor="#F7F6F3"DynamicHorizontalOffset="2"
Font-Names="Verdana"Font-Size="0.8em"ForeColor="#7C6F57"StaticSubMenuIndent="10px">
<StaticMenuItemStyleHorizontalPadding="5px"VerticalPadding="2px"/>
<DynamicHoverStyleBackColor="#7C6F57"ForeColor="White"/>
<DynamicMenuStyleBackColor="#F7F6F3"/>
<StaticSelectedStyleBackColor="#5D7B9D"/>
<DynamicSelectedStyleBackColor="#5D7B9D"/>
<DynamicMenuItemStyleHorizontalPadding="5px"VerticalPadding="2px"/>
<Items>
<asp:MenuItemText="File"Value="File">
<asp:MenuItemText="Find Patient"Value="Find Patient"NavigateUrl="javascript:PostWebRequest('FindPatient.aspx','divContent1');"></asp:MenuItem>
<asp:MenuItemText="Last Patient"Value="Last Patient"></asp:MenuItem>
<asp:MenuItemText="Find Episode"Value="Find Episode"NavigateUrl="javascript:PostWebRequest('FindEpisode.aspx','divContent2');"></asp:MenuItem>
</asp:MenuItem>
</Items>
<StaticHoverStyleBackColor="#7C6F57"ForeColor="White"/>
</asp:Menu>
</td>
</tr>
<tr>
<tdstyle="width: 100px"align="left">
<asp:UpdatePanelID="UpdatePanel1"runat="server"UpdateMode="Conditional"ChildrenAsTriggers="False">
<ContentTemplate>
<divid='divContent1'style="width: 100px; height: 100px">
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTriggerControlID="Menu1"EventName="MenuItemClick"/>
</Triggers>
</asp:UpdatePanel>
</td>
</tr>
<tr>
<tdstyle="width: 100px"align="left">
</td>
</tr>
</table>
</div>
<br/>
<div>
</div>
</form>
<divid='divContent2'style="width: 100px; height: 100px">
</div>

</body></html>
<%@dotnet.itags.org.PageLanguage="VB"AutoEventWireup="true"CodeFile="AnyModule1.aspx.vb"Inherits="_Default" %>
<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.1//EN""http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
<title>My Module</title>
</head>
<body>
<formid="form1"runat="server">
<asp:ScriptManagerID="ScriptManager1"runat="server">
<Scripts>
<asp:ScriptReferencePath="WebRequest.js"/>
</Scripts>
</asp:ScriptManager>
<divstyle="text-align: center">
<tableborder="0"cellpadding="0"cellspacing="0"style="width: 100%">
<tr>
<tdalign="left"style="width: 100px">
<asp:MenuID="Menu1"runat="server"BackColor="#F7F6F3"DynamicHorizontalOffset="2"
Font-Names="Verdana"Font-Size="0.8em"ForeColor="#7C6F57"StaticSubMenuIndent="10px">
<StaticMenuItemStyleHorizontalPadding="5px"VerticalPadding="2px"/>
<DynamicHoverStyleBackColor="#7C6F57"ForeColor="White"/>
<DynamicMenuStyleBackColor="#F7F6F3"/>
<StaticSelectedStyleBackColor="#5D7B9D"/>
<DynamicSelectedStyleBackColor="#5D7B9D"/>
<DynamicMenuItemStyleHorizontalPadding="5px"VerticalPadding="2px"/>
<Items>
<asp:MenuItemText="File"Value="File">
<asp:MenuItemText="Find Patient"Value="Find Patient"NavigateUrl="javascript:PostWebRequest('FindPatient.aspx','divContent1');"></asp:MenuItem>
<asp:MenuItemText="Last Patient"Value="Last Patient"></asp:MenuItem>
<asp:MenuItemText="Find Episode"Value="Find Episode"NavigateUrl="javascript:PostWebRequest('FindEpisode.aspx','divContent2');"></asp:MenuItem>
</asp:MenuItem>
</Items>
<StaticHoverStyleBackColor="#7C6F57"ForeColor="White"/>
</asp:Menu>
</td>
</tr>
<tr>
<tdstyle="width: 100px"align="left">
<asp:UpdatePanelID="UpdatePanel1"runat="server"UpdateMode="Conditional"ChildrenAsTriggers="False">
<ContentTemplate>
<divid='divContent1'style="width: 100px; height: 100px">
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTriggerControlID="Menu1"EventName="MenuItemClick"/>
</Triggers>
</asp:UpdatePanel>
</td>
</tr>
<tr>
<tdstyle="width: 100px"align="left">
</td>
</tr>
</table>
</div>
<br/>
<div>
</div>
</form>
<divid='divContent2'style="width: 100px; height: 100px">
</div>
</body>
</html>

As you can see from above I am trying to dynamically load webpages (FindPatient.aspx and FindEpisode.aspx) into UpdatePanel1 which holds a DIV (divContent1) when the relevant menu item is clicked.

I have two problems:

1. Using the javascript function that I call to replace the innerhtml of divContent1 with the selected webpage, causes errors on the page and no popluating of the DIV. However if I point the code to divContent2 - outside the update panel the innerhtml function works.

2. I need the called page to be displayed in the updatepanel because I dont want the menuitems on the base page to be refreshed each time the content pages causes a refresh.

Can anyone help?

Please

hello.

well, this is not the correct way of doing this. the updatepanel will let you refresh parts of a page, but it won't let you load a page on another. if that is what you want, then you should consider using an iframe.

Thanks for your quick response, I have traditionally used iFrames but understood that they were not an ideal solution. Sites such asiGoogle seem to suggest that AJAX does allow webpages to be displayed in an updatepanel because you can click on one of the YouTube videos and it will refresh the embedded page while leaving those areas outside it untouched. That is the kind of functionality that I am trying to achieve.

Any further ideas would be very much appreciated.

hello-

yes, that is correct. if you're into updatepanels, then i'd refactor the site so that each page is transformed into a user control which is loaded by the udpatepanel during partial postbacks. if you do know how to write js, then you shoudl do it all in the client side: you'd use web services to get the data and then js to replace the contents of the place holders. do notice that this is really hard to do and you'll have to be a good js coder (but it's the correct way of doing stuff, if you ask me that is)

Will VS 2008 help with JS coding with its builtin intellisense and debugging?

Help yes, but it's far from perfect. It infers as much as it can, but a lot it just can't guess at.

How do I distinguish between AJAX postback and regular postback?

I just installed Ajax 1.0 with VS2005 SP1 and am trying to add AJAX to an existing site.

However, the site right now has fairly complex code in the master page defined in Page_init, Page_load, and PreRender events. I'd really like to skip those calls if it is an AJAX post back. I looked at the Page class and found IsCallBack and IsPostBack, both of which will not be triggered by an AJAX post back.

I thought of using a hidden variable (something like AJAXCall) and using a Javascript to set a value with every control that can trigger an AJAX postback, but that seems like not the right way to do it.

Does anyone know how to tell the difference between the two, or is it possible to skip Page_init, Page_load, and PreRender events with an AJAX call?

Thanks,

Ming

Yes you can, but you have to use UpdatePanel.

Girijesh:

Yes you can, but you have to use UpdatePanel.

I have tried the following setups with no success. In the master page, I included my script manager. Then I had an update panel with a button which updates a label with the system time. This takes about 10 seconds to update. The debugger tells me it executes Page_Load, Page_Init and PreRender.

Then I tried to include an update panel with a button inside page that inherits the master page, it also goes into all 3 methods. I tried this with my existing website, as well as a brand new AJAX enabled website.

Any ideas?

Thanks,

Ming

Hi Ming,
You can use ScriptManager.IsInAsyncPostBack property to distinguish them.
Hope this helps.

Raymond Wen - MSFT:
Hi Ming,
You can use ScriptManager.IsInAsyncPostBack property to distinguish them.
Hope this helps.

It worked like a charm. Thanks for telling me exactly what I was looking for.

Thanks!

How do I Display an Animated GIF when afile is uploaded?

I cant believe how difficult this is to do. I asusmed using an updatepanel and an updateprogress control would handle this easily. My code is below. However "FileUpload1.PostedFile.FileName" is

always set to null. Can anyone suggest how I can display a simple animated gif when Im uploading a file to the server. I dont want a progress bar just a simple animated gif to show that something is a happening. Thanks!

protected void Button3_Click(object sender, EventArgs e)
{
string File1 = FileUpload1.PostedFile.FileName;

}

ASP.NET code:

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>

<asp:Button ID="Button3" runat="server" Style="z-index: 113; left: 8px; position: absolute;
top: 108px" Text="Button" OnClick="Button3_Click" />
<asp:FileUpload ID="FileUpload1" runat="server" Style="z-index: 101; left: 74px;
position: absolute; top: 438px" />

</ContentTemplate>
</asp:UpdatePanel>

<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl="~/Graphics/CAFQW3B9.gif" Style="z-index: 100;
left: 76px; position: absolute; top: 488px" />

</ProgressTemplate>
</asp:UpdateProgress>

Hi,

there are several controls that don't work asynchronously by putting them in an UpdatePanel controls. FileUpload is one of them so you need to set the uploadbutton to be a postbacktrigger of the UpdatePanel so a normal synchronous postback will occur.

Grz, Kris.

Thanks Kris. Im new to this and Im not really sure what you mean by "postbacktrigger". Can you point me to a url or post a ccode snippet that can explain how to show my animated gif on file upload?

Hi,

rangers99:
Im new to this and Im not really sure what you mean by "postbacktrigger".

You can take a look at the example on this page:http://ajax.asp.net/docs/mref/T_System_Web_UI_PostBackTrigger.aspx.

Grz, Kris.

How do i change the source code for an extender?

Hi all,

I have searched the forums, documentation and google but haven't found any help yet (mayby i'm searching for the wrong things). I need to modify ModalPopupExtender and have found the code i need to modify in the ModalPopupBehaviour.js but how can i change that code so that everytime i use a modalopupextender in my project it uses my modified extender. I'm guessing that i have to build it/something again but is it the cs project that i got when i downloaded the toolkit?

Could someone point me in the right direction mayby there is some kind og guide or how to that i haven't found. Or explain what i need to do.

Lot's of thanks!

Thought i'd explain what i wan't to achive.

In the modalpopupbeahvoiur code this code creates the background div:

this._backgroundElement = document.createElement('div');this._backgroundElement.style.display ='none';this._backgroundElement.style.position ='fixed';this._backgroundElement.style.left ='0px';this._backgroundElement.style.top ='0px';// Want zIndex to big enough that the background sits above everything else // CSS 2.1 defines no bounds for the <integer> type, so pick arbitrarilythis._backgroundElement.style.zIndex = 10000;if (this._BackgroundCssClass) {this._backgroundElement.className =this._BackgroundCssClass; }

I want to attach an onclick animation so that if a user clicks the background div then the modalpopup itsel should pulse. I thought of changing the above javascript code so that the div also got an id to witch i could attach the animation extender. But i don't know how to make my changes to the javascript code reflect in my project (see original post).

Is there perhaps an other way to create this animation? It should be somethink like if you bring up IE's properties window and click somewhere outside of it then the header flasehs.

Thanks again

I've shown how to modify the Javascript in an existing extender (in this case the ListSearch extender, to speed it up with massive lists) here:

http://damianblog.com/2007/06/19/speeding-up-listsearchextender/

You should be able to do the same kind of think with your changes to the ModalPopup. The key is to ensure that your web project references the newly build toolkit DLL.

Damian

Thanks! I'll check that out and get back when I get it to work! :)

I got it to work and thanks for your reply!

If anyone else wonders or reads this what i needed to do was to open the project file that was in the toolkit catalog and make my changes in the .js file then rebuild the project and make sure that my project (where I needed to use the changed extenders/behaviors) referenced to that newly build toolkit DLL in the toolkit bin debug or release folder.

/peronn

Saturday, March 24, 2012

How can i use xmlhttp to request a https url

Hi guys

Who know how to use the xmlhttp to request a https url , when i use such code , the response isThe certificate authority is invalid or incorrect
or nothing, who can tell me how to use xmlhttp or some asp.net ajax method to request a https url ,Thanks.

the code like belows:

<%@dotnet.itags.org. Page AspCompat=true Debug="true" %>

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

Dim xmlHttp
xmlHttp = Server.CreateObject("Msxml2.ServerXMLHTTP.6.0")

Dim sOutput As String
Dim url As String
url = "https://ibm/books.xml"

xmlHttp.open("GET", url, False)

xmlHttp.send()
sOutput = xmlHttp.ResponseText
Response.Write(sOutput)

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>tittle</title>
</head>
<body>
<form id="form1" runat="server">
<div>

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

After you have created your xmlHttp object, you can add this line which should ignore certificate errors:

xmlHttp.setOption(2) =13056

Alternatively, you should install a valid certificate on the server.

Thank you first, i tried your way and found the real reson was that IIS 6 disable the anonymous user visit, if i enable the anonymous visit, and i can

visit the https from xmlhttp, but there occured another question, the format of the xml file lost. why ?

and another question:

How can i send user name and password from xmlhttp if i enable the user name and password check function of iis security setup

the xml file and the reponse text as belows:

books.xml

<?xml version="1.0"?>

-<catalog>

-<book id="bk101">

<author>Gambardella, Matthew</author>

<title>XML Developer's Guide</title>

<genre>Computer</genre>

<publish_date>2000-10-01</publish_date>

<description>An in-depth look at creating applications with XML.</description>

</book>

-<book id="bk102">

<author>Ralls, Kim</author>

<title>Midnight Rain</title>

<genre>Fantasy</genre>

<publish_date>2000-12-16</publish_date>

<description>A former architect battles corporate zombies, an evil sorceress, and her own childhood to become queen of the world.</description>

</book>

-<book id="bk103">

<author>Corets, Eva</author>

<title>Maeve Ascendant</title>

<genre>Fantasy</genre>

<publish_date>2000-11-17</publish_date>

<description>After the collapse of a nanotechnology society in England, the young survivors lay the foundation for a new society.</description>

</book>

-<book id="bk104">

<author>Corets, Eva</author>

<title>Oberon's Legacy</title>

<genre>Fantasy</genre>

<publish_date>2001-03-10</publish_date>

<description>In post-apocalypse England, the mysterious agent known only as Oberon helps to create a new life for the inhabitants of London. Sequel to Maeve Ascendant.</description>

</book>

-<book id="bk105">

<author>Corets, Eva</author>

<title>The Sundered Grail</title>

<genre>Fantasy</genre>

<publish_date>2001-09-10</publish_date>

<description>The two daughters of Maeve, half-sisters, battle one another for control of England. Sequel to Oberon's Legacy.</description>

</book>

-<book id="bk106">

<author>Randall, Cynthia</author>

<title>Lover Birds</title>

<genre>Romance</genre>

<publish_date>2000-09-02</publish_date>

<description>When Carla meets Paul at an ornithology conference, tempers fly as feathers get ruffled.</description>

</book>

-<book id="bk107">

<author>Thurman, Paula</author>

<title>Splish Splash</title>

<genre>Romance</genre>

<publish_date>2000-11-02</publish_date>

<description>A deep sea diver finds true love twenty thousand leagues beneath the sea.</description>

</book>

-<book id="bk108">

<author>Knorr, Stefan</author>

<title>Creepy Crawlies</title>

<genre>Horror</genre>

<publish_date>2000-12-06</publish_date>

<description>An anthology of horror stories about roaches, centipedes, scorpions and other insects.</description>

</book>

-<book id="bk109">

<author>Kress, Peter</author>

<title>Paradox Lost</title>

<genre>Science Fiction</genre>

<publish_date>2000-11-02</publish_date>

<description>After an inadvertant trip through a Heisenberg Uncertainty Device, James Salway discovers the problems of being quantum.</description>

</book>

-<book id="bk110">

<author>O'Brien, Tim</author>

<title>Microsoft .NET: The Programming Bible</title>

<genre>Computer</genre>

<publish_date>2000-12-09</publish_date>

<description>Microsoft's .NET initiative is explored in detail in this deep programmer's reference.</description>

</book>

-<book id="bk111">

<author>O'Brien, Tim</author>

<title>MSXML3: A Comprehensive Guide</title>

<genre>Computer</genre>

<publish_date>2000-12-01</publish_date>

<description>The Microsoft MSXML3 parser is covered in detail, with attention to XML DOM interfaces, XSLT processing, SAX and more.</description>

</book>

-<book id="bk112">

<author>Galos, Mike</author>

<title>Visual Studio 7: A Comprehensive Guide</title>

<genre>Computer</genre>

<publish_date>2001-04-16</publish_date>

<description>Microsoft Visual Studio 7 is explored in depth, looking at how Visual Basic, Visual C++, C#, and ASP+ are integrated into a comprehensive development environment.</description>

</book>

</catalog>

-------------

the response:

Gambardella, Matthew Computer 44.95 2000-10-01 An in-depth look at creating applications with XML. Ralls, Kim Fantasy 5.95 2000-12-16 A former architect battles corporate zombies, an evil sorceress, and her own childhood to become queen of the world. Corets, Eva Fantasy 5.95 2000-11-17 After the collapse of a nanotechnology society in England, the young survivors lay the foundation for a new society. Corets, Eva Fantasy 5.95 2001-03-10 In post-apocalypse England, the mysterious agent known only as Oberon helps to create a new life for the inhabitants of London. Sequel to Maeve Ascendant. Corets, Eva Fantasy 5.95 2001-09-10 The two daughters of Maeve, half-sisters, battle one another for control of England. Sequel to Oberon's Legacy. Randall, Cynthia Romance 4.95 2000-09-02 When Carla meets Paul at an ornithology conference, tempers fly as feathers get ruffled. Thurman, Paula Romance 4.95 2000-11-02 A deep sea diver finds true love twenty thousand leagues beneath the sea. Knorr, Stefan Horror 4.95 2000-12-06 An anthology of horror stories about roaches, centipedes, scorpions and other insects. Kress, Peter Science Fiction 6.95 2000-11-02 After an inadvertant trip through a Heisenberg Uncertainty Device, James Salway discovers the problems of being quantum. O'Brien, Tim Computer 36.95 2000-12-09 Microsoft's .NET initiative is explored in detail in this deep programmer's reference. O'Brien, Tim Computer 36.95 2000-12-01 The Microsoft MSXML3 parser is covered in detail, with attention to XML DOM interfaces, XSLT processing, SAX and more. Galos, Mike Computer 49.95 2001-04-16 Microsoft Visual Studio 7 is explored in depth, looking at how Visual Basic, Visual C++, C#, and ASP+ are integrated into a comprehensive development environment.

dotnetstudy:
How can i send user name and password from xmlhttp if i enable the user name and password check function of iis security setup

Hi,

According to the API of XmlHttpRequest, username and password can be passed in as parameters of Open method.

Please refer to this:
void open(in DOMString method, in DOMString url, in boolean async, in DOMString user, in DOMString password);

Hope this helps.

thank you very much , it works well.

but can you tell me why the xml file requested by xmlhttp lost it's data format like ie requesting it? the xml is above.

Can you try it with a local xml file in your site to see if this problem still exists?

Thank your help , i know the reason that is i use xmlhttp.responsetext. that is the reason i think.

Wednesday, March 21, 2012

How can I UpdatePanel.Update() during processing

Follow the code test.I'm trying to show each line per time... but this 5 lines were showed after the proc ended

How can I do this ?

For iAsInteger = 1To 5
Dim drAs DataRow = Session("dt").Rows.Add
dr("DLLFilename") =CStr(i * 1)
dr("DLLDatetime") =CStr(i * 2)
dr("PackageName") =CStr(i * 3)
dr("PackageID") =CStr(i * 4)
dr("DLLFolder") =CStr(i * 5)
dr("MSIFolder") =CStr(i * 6)

GridView1.DataSource =New DataView(Session("dt"))
GridView1.DataBind()
UpdatePanel1.Update()

System.Threading.Thread.Sleep(1000)
Next

The data is only sent to the browser when the server method completes. Calling Update() only flags the updatepanel to be updated when the server processing is complete.

How can I see ModalPopup js code ?

I'm a big fan of the modal popup extender and I'm trying to implement it using plain DHTML since my client have no asp.net server and I'm using classic ASP.

As you know, there is a classic IE annoying bug with COMBO BOXES. They stay on top of every div, without respecting the z-index layout.

I'm interested in learning how the Ajax Control Toolkit programmers handled this situation so I can do the same.

I can't just hide the combos, since I'm usiing a transparent Modal Background and I wish I could see the combos BEHIND the Modal Background.

Thanks!

Hi,

You can download the source codehere. Its implementation can be found in ModalPopupBehavior.js file.

thanks

How can I open Modal Popup from code behind

I have a page that on load builds a datatable base on the users userid.

An if else statment detemrines whetehr or not the user simply proceeds or else has to make a selection prior to proceeding.

So there is no control to open the modal popup from like a button click...and whats more not EVERY person accessing the window will get the modal popup.

I assume there is a way in the code behind that I can fire up the Modal Popup as a condition of the else...

any help would be appreciated.

Call the show method.

ModalPopupExtender1.show()

How can I get this ModalPopupExtender to work with Master Pages?

Here's some pretty simple code that displays a modal pop-up when a button is pressed:

1<%@dotnet.itags.org. Page Language="C#" AutoEventWireup="true" CodeFile="5_UpdateProgModal.aspx.cs" Inherits="_5_UpdateProgModal" %>23<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
4<html xmlns="http://www.w3.org/1999/xhtml">
5<head runat="server">
6 <title>ASP.Net AJAX 201</title>
7 <style type="text/css">
8 .error{color: #f00;}
9 .message{color: #000;}
10 .updating{margin: 12px;}
11 .modalBackground
12 {
13 background-color:#00f;
14 filter:alpha(opacity=40);
15 opacity:0.40;
16 }
17 .updateProgress
18 {
19 border: solid 1px #333;
20 background-color:#fff;
21 position:absolute;
22 text-align: center;
23 width:160px;
24 height:60px;
25 }
26 .updateProgressMessage
27 {
28 margin:3px;
29 vertical-align: middle;
30 }
31 </style>
32</head>
33<body>
34 <form id="form1" runat="server">
35 <asp:ScriptManager ID="ScriptManager1" runat="server" AsyncPostBackTimeout="3" />
36 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
37 <ContentTemplate>
38 <div>
39 <asp:Button ID="btnShowTime" runat="server" Text="Show Time" OnClick="btnShowTime_Click" />
40 <asp:Button ID="btnError" runat="server" Text="Throw Error" OnClick="btnError_Click" />
41 <asp:Button ID="btnTimeout" runat="server" Text="Timeout" OnClick="btnTimeout_Click" />
42 </div>
43 <div>
44 <asp:Label ID="lblMessage" runat="server" Text="Label"></asp:Label>
45 </div>
46 </ContentTemplate>
47 </asp:UpdatePanel>
48 <asp:Panel ID="pnlProg" runat="server" CssClass="updateProgress" style="display:none">
49 <div class="updating">
50 <img src="images/ajax-loader.gif" alt="Processing..." />
51 <span class="updateProgressMessage">Processing...</span>
52 </div>
53 </asp:Panel>
54 <AjaxToolkit:ModalPopupExtender
55 ID="mdlProgress"
56 runat="server"
57 TargetControlID="pnlProg"
58 PopupControlID="pnlProg"
59 BackgroundCssClass="modalBackground"/>
60 </form>
61 <script type="text/javascript">
62 var prm = Sys.WebForms.PageRequestManager.getInstance();
63 prm.add_beginRequest(beginRequest);
64 prm.add_endRequest(endRequest);
65
66 function beginRequest(sender, args)
67 {
68 $find("mdlProgress").show();
69 }
70
71 function endRequest(sender, args)
72 {
73 $find("mdlProgress").hide();
74
75 var messageSpan = $get("<%= lblMessage.ClientID%>");
76 if (args.get_error() != undefined)
77 {
78 var errorMessage = args.get_error().message;
79 if (args.get_error() && args.get_error().name === 'Sys.WebForms.PageRequestManagerTimeoutException') {
80 errorMessage = "Your operation has timed out.";
81 }
82 args.set_errorHandled(true);
83 messageSpan.className = "error";
84 messageSpan.innerHTML = errorMessage;
85 }
86 }
87 </script>
88</body>
89</html>
90

The code behind for the buttons just does a Threading.Sleep() for testing purposes so I'm not going to bother posting that code.

The problem is, I want to use this in a master page... However, when I put all this code in my master page, it doesn't work. I end up getting Javascript errors that I can't figure out. Any ideas as to why the above code works perfect yet won't work in a master page?

Hi,

Change
$find("mdlProgress")
to:
$find("<%=mdlProgress.ClientID%>")

Then, no matter master page or page, it works!

Best Regards,

The code posted by you is simple and handy and I like its simplicity for quick trials..

That was it.

I figured it was my lack of Javascript knowledge. :) Thanks so much!

How Can i Get the new Values from the PopupWindow in Atlas ModalPopupWindow with samples

if i change the textbox values in Popupwindow and if i click the ok button (ServerSide code) I cant get the new values from the popup window in modalpopupExtender.Anyone Please help me how can i get the new values from the popupwindow in atlas modalpopupExtender.Explain with simple example.

Thanks

Hi,

Try this:

<%@. Page Language="VB" %>
<%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs)
TextBox1.Text = DateTime.Now.ToString()
End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="always">
<ContentTemplate>
<asp:Panel ID="Panel1" onscroll="javascript:saveScroll();" runat="server" Height="50px" Width="125px" Style="position: static;
overflow: scroll; height: 350px; border: solid 1px blue; background-color: White;
display: none;">
<table border="0" cellpadding="0" cellspacing="0" width="480px">
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
</table>
<asp:Button ID="Button1" runat="server" Text="Update" OnClick="Button1_Click" />
<asp:Button ID="Button3" runat="server" Text="Close" />
<asp:Button ID="Button4" runat="server" Text="OK" />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</asp:Panel>
<asp:Button ID="Button2" runat="server" Text="Show" />
<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" PopupControlID="Panel1" OkControlID="Button4"
CancelControlID="Button3" TargetControlID="Button2">
</cc1:ModalPopupExtender>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
<script type='text/javascript'>
var scrollLeft = 0;
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function EndRequestHandler(sender, args) {
document.getElementById('Button2').click();
setScroll();
}
function setScroll()
{
document.getElementById('<%= Panel1.ClientID %>').scrollLeft = scrollLeft;
}

function saveScroll()
{
scrollLeft = document.getElementById('<%= Panel1.ClientID %>').scrollLeft;
}
</script>
</body>
</html>

Get the value in javascript via "document.getElementById('TextBox1').value".

Best Regards

Monday, March 26, 2012

How Do I Dynamically Load Pages Into An UpdatePanel

How do I distinguish between AJAX postback and regular postback?

How do I Display an Animated GIF when afile is uploaded?

How do i change the source code for an extender?

Saturday, March 24, 2012

How can i use xmlhttp to request a https url

Wednesday, March 21, 2012

How can I UpdatePanel.Update() during processing

How can I see ModalPopup js code ?

How can I open Modal Popup from code behind

How can I get this ModalPopupExtender to work with Master Pages?

How Can i Get the new Values from the PopupWindow in Atlas ModalPopupWindow with samples

Going For AJAX

Blog Archive

About Me