I have a tabpanel with a calendar control on the 4th tab but when I select a date, the postback causes the tabpanel to return to the first tab instead of the 4th that it came from.
Is there a way to get it to return to the tab that the calendar control is on and not revert back to the first tab ?
I know setting autoPostback to true on the TabContainer will do this but that means it reloads on every tab change not just the one I want.
Any ideas ?
Wrapping the contents of the fourth tab in an UpdatePanel control should do the trick.
<ajaxToolkit:TabPanel runat="server" ID="tabCS" HeaderText="Country Settings">
<ContentTemplate>
<asp:UpdatePanel runat="server" ID="upCountry" UpdateMode="Conditional">
<ContentTemplate>
... content and calendar
</ContentTemplate>
</asp:UpdatePanel>
</ContentTemplate>
</ajaxToolkit:TabPanel>
Here is a best practice that I've found.
Unless other tabs in the tab panel need to be updated only put the contents of each panel in an update panel. If you need to update other panels you can call the method programmatically to update them.
There are two good reasons for this:
1.) By putting update panels in the tabs you will have fewer bits to get back from the server.
2.) Calling the update methods programmatically makes you more aware of what it is you are providing the end user and you won't forget to update the data.
Remember that if you use multiple panels to change the update mode from always to conditional so that only the relevant information is updated on the client.
Also if you want to put the entire tab panel control into the update panel you may need to add any formatting that is done to a CSS file since my experience is that it fails to retain the default formatting with it updates.
If you need more info or a code sample just message me.
Andrew
Related
I reference a previous post: Focus lost on partial postback with UserControls inside UpdatePanel
where an excellent solution works perfectly for web-page controls within a form.
However, I have placed my UC inside a detailsview template-field (for Edit+Insert).
The UC contains an UpdatePanel needed to adjust the text-formatting and control's style(s) following the TextChanged event of the UC-textbox (AutoPostback=True) during the Edit-mode and Insert-modes of the DetailsView.
As such, when the DetailsView-control is in Edit-mode, and user changes Text in the UC, the textchanged event is fired and the user-entered value is validated and when OK, the thousounds-separator (comma) are added to the UC-textbox-text, BUT, the focus moves to the next field in the DetailsView and QUICKLY returns back to the UC-control.
This incorrect focus-move(s) does NOT occur when the UC is wrapped in updatepanels as noted in the referenced post since the focus and tabbing order works perfectly outside of the DetailsView control.
Here is the aspx markup for the template-field-EDIT (only).
<asp:TemplateField HeaderText="Initial Mileage" SortExpression="IMilage">
<EditItemTemplate>
<asp:UpdatePanel ID="updpnlIMilage" runat="server" UpdateMode="Conditional" >
<ContentTemplate>
<TGANumeric:GANumeric ID="ucnumIMileage" runat="server"
Caption="Initial Mileage" HideCaption="True" Width="160"
DisplayMask="999,999" InputMask="999999"
Enabled="True" IsRequired="False"
MinNumber="0" MaxNumber="999999"
Text='<%# Bind("IMilage") %>'
TabIndex="0"
/>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ucnumIMileage" />
</Triggers>
</asp:UpdatePanel>
</EditItemTemplate>
Thanks in advance. Your comments are welcome.
Thanks...J.
So are you saying your control hierearchy (partial) is:
UpdatePanel > TGANumeric:GANumeric > UpdatePanel > TextBox
This is an awful lot of overhead to just format a number with a comma, which is the only reason I see for your posting back. As far as I can tell there is nothing you need from the server, so why post?
Or is there?
My thoughts, lose the update panels, disable the AutoPostback on the Textbox, handle the formatting client side if it must be seen immediately, or leave the formatting to the DetailsView field DataStringFormat when it posts after save.
I'm betting this will clear up any focus issues.
Based on all the comments in this thread, I want to explain the actual root cause of the tabbing misbehavior.
1) There were no coding issues or event-issues with the user-control.
2) There were no coding issues or event-issues with the layering of Master-page, Content-page, Ajax update-panels / nested update-panels, details-view and template-fields containing the user-control.
3) The real culprit was a small snippet of code where the page adjusts the web-controls on the form based on the "state" (status) of the page/form. I manage the adjusting of visible and/or enabling of web-controls in a single subroutine in the code-behind so that all of this enabling/disabling visible/not-visible occurs in one place under a set of CASE-statements.
The actual erroneous snippet of code inside the 'sbSetFormState()'-method was messing with the class-variable 'm_eFormState' that actually caused the update panel to re-fire and thus the tabbing got thrown out of sequence.
This was discovered by the great suggestion from 'fnostro' to remove or add functionality features until the mis-behavior exposes itself.
I mark this topic as resolved/closed.
Again, thanks to fnostro !!!
I have a panel control in which i placed a grid view control which is databinded to an SQL datasource in the code-behind file. This panel is in an update panel. I intend printing the grid view. I, however, want to session the grid view to a "Preview Page" before print it.
I followed the instruction i found in an article on printing. Here is the link to the article:
http://www.dotnetcurry.com/(X(1)S(tij3zct1vrlnntfrzfl22ko1))/ShowArticle.aspx?ID=92
The example in the article worked fine. However, mine didn't work because it's in an update panel.
Please how do i make it work. The update panel is very much needed. Please HELP!!!
From what I see on the example the main code is happends on PrintWebControl and what actually this do is do direct render the content inside a new form. This as it is you can not do it inside the UpdatePanel, but you can call it out side of UpdatePanel.
The only think that you have to do is to place the print button outside of the UpdatePanel to make a full post, or to setup UpdatePanel to not use this print control for update.
This is the button that you need to get out of UpdatePanel.
<asp:Button ID="btnPrint" runat="server" OnClick="btnPrint_Click" Text="Print" />
To make update panel to make full post back, or add this pro grammatically when the control exist on page.
<Triggers>
<asp:PostBackTrigger ControlID="btnPrint" />
</Triggers>
I am using AJAX extension in visual studio 2005.
First of all i am created a Web custom control which contains Dropdown list.
I have also set AutoPostBack="true" for getting its SelectionEventChange event.
I am added this web control on another page inside a UpdatePanel.(i added dynamically on another page).
MyControl = (MyControl) LoadControl("MyControl.ascx")
My problem is when i select the values from dropdown it refersh my whole update panel.
What can i do please help me.
I searched in google and somebody says Use triggers
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DropDownList1" EventName="SelectedIndexChanged" />
But on AJAX Extension i am not getting it please Help me.
Triggers tag is part of update panel. Also look at some other important properties of UpdatePanel and search on how to use and referesh nested update panels.
Add this web custom control inside another(other then one you are already having, that is, have Multiple UpdatePanels) UpdatePanel, and call .Update() manually, in order to refresh only the web control.
Dont forget to set the UpdateMode to Conditional.
I have a dropdown which shows filesnames and when the index is changed, the slected file is offered for download. I also have a button which creates new files ... now after a new file was created, the new filename should also be shown in the dropdown. It works fine, when I refresh the page, but this is not what I want.
I tried putting the dropdown in an updatepanel and giving it the file create button id, it failed ... is this the correct apporach or is there an easier way?
Thanks!
I just cant get it to work, this is my code:
<asp:UpdatePanel ID="UP_ExportInvoices" runat="server" UpdateMode="Always">
<ContentTemplate>
<asp:DropDownList ID="DDL_ExportFileDownLoad" runat="server" AutoPostBack="true"
OnSelectedIndexChanged="DDL_ExportFileDownLoad_SelectedIndexChanged">
</asp:DropDownList>
</ContentTemplate>
</asp:UpdatePanel>
I was thinking that if the UpdateMode is set to Always, that the content is always updated? I also have that button (asp:ImageButton) which resides outisde this UpdatePanel. I tried adding a Trigger fpr that button, but it did not work. What am I making wrong. So far, im only thrwoing exceptions or the dropdown is not updated.
Thanks :)
If you are creating the file in the same page, then just append the file name to the dropdown. Can you do this trick in your application?
Does you button posts back the page? If yes, then you need to rebind the drop-down again after you create the file in button click handler.
If button makes partial post-back (say it is placed within UpdatePanel) to the server then above will be still applicable but dropdown should also be in UpdatePanel.
You need to ensure that the Button is a trigger for the Update Panel, or is a child within it.
Here is a full explanation:
http://www.asp.net/ajax/tutorials/understanding-asp-net-ajax-updatepanel-triggers
You need to place the button within the UpdatePanel. This will cause a partial postback and the dropdown should re-bind, showing the new item. Alternatively you can include JavaScript in your page which adds the new item to the dropdown list on the client-side, however this can sometimes cause problems with ASP's automatic event validation.
Much like when you are looking for support on a website or whatever, you choose Product from the first listbox (say, Hard Disk), which triggers and populates a second listbox with more options (say, "Solid State", "SATA"), and so on...
The problem I am having is that when you select something from the second listbox that should populate the third one, the postback triggers the first listbox too, which then repopulates the 2nd one back to its default value.
Eg.
[Dropdown 1] (contains A B C D E)
[DropDown 2] (A in dropdown 1 has options X Y Z)
[Dropdown 3] ...
If you choose A, then dropdown 2 populates with XYZ. You choose Z, and it should update dropdown3, but the postback also triggers dropdown 1 again, which replaces Dropdown 2's contents and resets the value back to X.
I am looking for an elegent solution. I had one that said only repopulate dropdown 2 if dropdown 1 has changed, but it means keeping track of what dropdown 1 was before the page posted back.
Each dropdown is in an updatepanel and set to autopostback=true, and each updatepanel has the previous listbox in its triggers.
First Check if the second TextBox isn't a trigger to the first UpdatePanel, if it is then remove it from the first update panel's Triggers Collection.
Here's the Key Concept:
If you have two separate tags you should place a trigger tag in the second update panel and insert a AsyncPostBackTrigger with the controlID of the first dropdownlist, here's a simple example:
<asp:UpdatePanel runat="server">
<ContentTemplate>
<asp:Label runat="server" ID="TxtBox1" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel runat="server">
<ContentTemplate>
<asp:Label runat="server" ID="TxtBox2" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="TxtBox1" />
</Triggers>
</asp:UpdatePanel>
I would simply put all the drop downs in the same update panel. It might not be as efficient, but it will probably bee good enough and certainly require less lines of code.
Why don't you try AjaxControl Toolkit CascadingDropDown. It seems to suit your needs.
Also, this will improve performance, as postback won't be sending all page information (as does with update panel).
I figured it out - I can use ScriptManager1.AsyncPostBackSourceElementID to check what caused the trigger, and make it refresh only for postback and the first dropdown box.
Maybe I'm thinking too simplified, but why wouldn't you just be handling all these events ... as events? Populate DDL1 only on initial Page_Load. Populate DDL2 only on DDL1.SelectedIndexChanged. Populate DDL3 only on DDL2.SelectedIndexChanged...