ASP. NET AJAX Starter Series (9): Using UpdatePanel in master Pages
This article briefly describes the use of UpdatePanel controls in master pages, translated from official documents.
Main content
1. Adding UpdatePanel controls to the content Page
2. Refresh UpdatePanel with master page
A Adding UpdatePanel controls to Content-page
1. Add a new master Page and switch to Design view.
2. In the Toolbox, under the AJAX Extensions tab, double-click the ScriptManager control to add to the page, and make sure that the ScriptManager control is added outside the ContentPlaceHolder control.
3. Add the text "Master Page" to the ContentPlaceHolder control.
4. Under the HTML tab of the Toolbox, drag horizontal Rule (horizontal line) to the text and the page looks like this:
5. Create a content page and select its master page for the page we just created.
Right-click in the Solution Manager and select the Add New Item menu command, select the Select Master page in the Add New Item dialog box and click the OK button.
6. Enter the content page in the content control in the content page, and add a UpdatePanel control.
7. Add the Calendar control in the UpdatePanel control.
8. Save and press CTRL + F5 to run.
9. When you click the last month and next month buttons in the Calendar control, the page does not have a full page refresh.
Two Refresh UpdatePanel with master page
In this example we will add some controls to the master page that will raise an asynchronous commit and refresh UpdatePanel in the content page.
1. Switch to Design view in the master page.
2. Add some text and two buttons to the page, set the ID property of a button and the Text property to Decrementbutton and "-" respectively, set the ID property of the other button and the Text property to Incrementbutton and "+", respectively.
3. Select the + button, enter Masterbutton_click in the Click event box of the Properties window, and repeat once for the button.
4. Double-click the page outside the control to add Page_Load event handling.
5. Add the following code to the Page_Load event handler, registering the two button as the asynchronous Submit button.
protected void Page_Load (object sender, EventArgs e)
{
Scriptmanager1.registerasyncpostbackcontrol (Decrementbutton);
Scriptmanager1.registerasyncpostbackcontrol (Incrementbutton);
}
6. Add the following code to create a Masterbutton_click event handler.
This. Offset = this. Offset-1;
Break
}
((UpdatePanel) Contentplaceholder1.findcontrol ("UpdatePanel1")). Update ();
Calendar cal = ((Calendar) Contentplaceholder1.findcontrol ("Calendar1"));
DateTime newdatetime = DateTime.Today.Add (New TimeSpan (Offset, 0, 0, 0));
Cal. SelectedDate = Newdatetime;
}
7. Create a public property offset in the master page to display the difference between the selected date and day.
}
8. In the content page, switch to Design view and double-click the Calendar control to add a SelectionChanged event handler that sets the offset property when the user selects the date.
9. Add the following code to the SelectionChanged event handler.
protected void Calendar1_SelectionChanged (Object Sender,eventargs e)
{
DateTime selectedDate = calendar1.selecteddate;
Master.offset =
(TimeSpan) Calendar1.SelectedDate.Subtract (
Datetime.today)). Days;
}
10. Add the following code to the Page_Load event in the Content Page page.
protected void Page_Load (object sender, EventArgs e)
{
DateTime Newdatetime =
DATETIME.TODAY.ADD (New
TimeSpan (master.offset, 0, 0, 0));
Calendar1.selecteddate = Newdatetime;
}
11. Add the @ MasterType tag to the page so that you can refer to the offset property of the master Page page as a strongly typed property.
12. In the content page, switch to Design view and select the UpdatePanel control.
13. In the Properties window, set UpdateMode to conditional.
14. Save and press CTRL + F5 to run.
15. You can see the full page refresh by clicking the previous month and next month buttons in the Calendar control.
16. Select a date and click the button in the master page to see that there is still no full page refresh.
[translated from official documents]
Support Terrylee's entrepreneurial product Worktile
Worktile, a new generation of easy to use, experience the ultimate team collaboration, project management tools, let you and your team work together anytime, anywhere. It's completely free, so get to know it now.
https://worktile.com Category: [[] web Development, [] Ajax Storm Green channel: Good text to the top of my collection This article contact me Terrylee
Follow-33
Followers-2798 + Plus follow 1 0 (please comment on the article) «Previous: ASP. NET AJAX Starter Series (8): Custom Exception Handling
» Next: Three videos on ASP. Posted @ 2006-11-13 18:00 Terrylee Read (22383) Comments (69) Edit Favorites < Prev12
Comment List reply reference #51 building 2007-12-24 10:50 Shini [unregistered user]15. You can see the full page refresh by clicking the previous month and next month buttons in the Calendar control.
Here is not wrong. Should be: "Click the previous month and the next month button in the Calendar control to see no full page refresh. "Reply reference #52 floor 2008-05-07 14:02 suker[Unregistered user" the article written by the landlord is very good ah ... The key is very popular ... After watching, I learned a lot of things ~ Thank you!!! Reply to references #53 building 2008-06-06 14:58 The snail's body is an ant, brother Li. I want to ask a question. is a master page with a TreeView on the left and a GridView to the right, which is, of course, another page. is embedded in the ContentPlaceHolder), click a node in the left TreeView (node has a connection). The left does not refresh, the right (ContentPlaceHolder) shows the GridView, how to implement with UpdatePanel ah .... Thank you. Thanks again ..... Support (0) objection (0) reply quoted #54 building 2008-06-18 17:59 wind-zx[Unregistered user] may I have a few in UpdatePanel
ContentTemplate
What is the relationship between ContentTemplate and UpdatePanel? Thank you for replying to #55 2008-09-01 16:20 peng_sunshine[unregistered user] landlord, ask a question. I want to use a local refresh under an existing ASP. NET Web application.
The AJAX run environment configuration has been completed by steps. Then make the following changes in the Web application:
1 configuration of the Web. config
2 Create Bin folder, add System.Web.Extensions.dll and AjaxControlToolkit.dll
3 Adding a ScriptManager control to a master page
4 Add UpdatePanel to the content page and include a table in the ContentTemplate in UpdatePanel.
There is no problem at the start of the page, it works fine, but sometimes the error type is as follows:
1 Error 36 Unrecognized tag prefix or device filter "__designer".
2 Error 36 Element "UpdatePanel" is not a known element. This could be due to a compilation error in the Web site.
3 The Code in table is capitalized and no branches are displayed.
But running everything is normal, and even more strange is that errors 1 and 2 are sometimes present. Hope teacher time to give answers, send me e-mail, thank you!
Reply reference #56 building [landlord] 2008-09-01 22:05 Terrylee @Peng_sunshine
If the Web. config is configured with normal flowers, there should be no such problems, and it does not feel like a program problem and may be related to your environment. Support (0) against (0) reply to reference #57 building 2008-09-02 16:43 peng_sunshine[unregistered user] @TerryLee
Yes, there's one more mistake.
Authentication (Internet Explorer 6): Element "ContentTemplate" is not supported.
My webconfig configuration is referenced in the AJAX Web page.
Then I set up an AJAX Web page to copy my normal ASP. NET Web program project to Ajax
Only Sitemaps and ConnectionString nodes were set in Webconfig. The program can also be run at first, everything is OK. Then there was a previous mistake.
And I installed the AJAX futures CTP can still not.
Reply to references #58 building 2008-12-24 14:10 Ah, ah. [Unregistered user]15. You can see the full page refresh by clicking the previous month and next month buttons in the Calendar control.
This should be the whole page is not refreshed. Reply reference #59 Lou [landlord] 2008-12-25 15:13 Terrylee @ Ah ah ah
Oh, actually this example wants to test the use of UpdatePanel in master ... Support (0) objection (0) Reply reference #60 building 2008-12-30 11:01 pizixie[unregistered user] hehe @TerryLee
You are really responsible ... So long post you will look slowly ... Reply reference #61 building [landlord] 2009-01-04 11:24 Terrylee @pizixie
I want to try to reply to every comment, but sometimes often omitted, so still not responsible, hehe support (0) against (0) Reply quote #62 building 2009-01-09 11:03 visitor 512[unregistered users] crazy top!
Unfortunately there is no sample code to download, but also to write their own code, trouble!!!!! Reply reference #63 building [landlord] 2009-01-12 11:25 Terrylee @ tourist 512
Do not provide download, just want to do some hands-on support (0) against (0) reply quoted #64 building 2009-02-20 09:40 ASP [unregistered users] According to the example of the landlord, and then combined with their actual changes, you can only refresh the UpdatePanel of the master page, can also be synchronized refresh, thank you! Reply Reference #65 floor 2009-05-21 17:34 nightcat[unregistered user] by the landlord this sentence guide, special reply.
Another, the landlord article is very good, praise one!
--Reference--------------------------------------------------
Terrylee: @pizixie
I want to try to do a reply to every comment, but sometimes often omitted, so still not responsible, hehe
--------------------------------------------------------reply reference #66 building [landlord] 2009-05-22 13:44 Terrylee @NightCat
:P Support (0) against (0) reply to cite #67 Lou 2009-07-16 16:34 aloner very depressed foreigner's wording.
Why do you always like to offset some out, and then write the offset property? No words ... Support (0) against (0) reply to cite #68 Lou 2009-07-16 16:34 aloner very depressed foreigner's wording.
Why do you always like to offset some out, and then write the offset property? No words ... Support (0) objection (0) Reply reference #69 building 2009-09-09 10:17 YUZHIWUSFM Why I made it out in the Calendar control, click the previous month and the next month button, no full page refreshes
ASP. NET AJAX Starter Series (9): Using UpdatePanel in master Pages
