I am sure it's something dumb.
Using the december preview. How do I update a panel on page load without a timer or a button? Obviously I want this done after the page loads and renders.
Thx
dB.
I am sure it's something dumb.
Using the december preview. How do I update a panel on page load without a timer or a button? Obviously I want this done after the page loads and renders.
Thx
dB.
Greetings, clever ASP.NET AJAX users.
I have a data-bound Accordion with a Button in each header. Cliking the button changes a label inside an UpdatePanel. But I don't want a full postback when the Button is clicked. I just want the UpdatePanel itself updated.
I have tried registering the ItemCommand event of the Accordion as a trigger, but I get this error message, which I don't understand:
Control with ID 'accAccordion' being registered through RegisterAsyncPostBackControl or RegisterPostBackControl must implement either INamingContainer, IPostBackDataHandler, or IPostBackEventHandler.
Here is my code:
<asp:UpdatePanel ID="upUpdatePanel" runat="server" ChildrenAsTriggers="true" > <ContentTemplate> <div style="border:1px solid black;"> Name: <asp:Label ID="lblName" runat="server" /><br /> <asp:Button ID="btnChange" runat="server" OnClick="btnChange_Click" Text="Inside Update Panel"/> </div> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="accAccordion" EventName="ItemCommand" /> </Triggers> </asp:UpdatePanel> <br /> <ajaxtoolkit:Accordion ID="accAccordion" runat="server" RequireOpenedPane="false" OnItemDataBound="accAccordion_ItemDataBound" OnItemCommand="accAccordion_ItemCommand"> <HeaderTemplate> header: <asp:Button ID="btnChange" runat="server" CommandArgument="Inside Update Panel" /> </HeaderTemplate> <ContentTemplate> content:<br /> </ContentTemplate> </ajaxtoolkit:Accordion>
public partialclass _Test : System.Web.UI.Page{protected string[] aNames = {"foo","bar","baz" };protected void Page_Load(object sender, EventArgs e) {this.accAccordion.DataSource =this.aNames;this.accAccordion.DataBind(); }protected void btnChange_Click(Object sender, EventArgs e) {this.lblName.Text =this.btnChange.Text; }protected void accAccordion_ItemDataBound(Object sender, AjaxControlToolkit.AccordionItemEventArgs e) {if (e.AccordionItem.ItemType == AjaxControlToolkit.AccordionItemType.Header) { Button btnChange = (Button)e.AccordionItem.FindControl("btnChange"); btnChange.Text = e.AccordionItem.DataItem.ToString(); btnChange.CommandArgument = btnChange.Text; } }protected void accAccordion_ItemCommand(Object sender, CommandEventArgs e) {this.lblName.Text = e.CommandArgument.ToString(); }}Obviously if I remove the trigger the error goes away, but then I don't get partial page rendering. I tried adding code to the ItemDataBound event of the Accordion to register the Button with the ScriptManager as an AsyncCallBack or whatever it is, and then added code to the ItemCommand event to call the Update() method of the UpdatePanel, but that doesn't work either -- I still get a full postback.
Any ideas?
If it's not feasible to trap the ItemCommand event of the Accordion or the Click event of the Button, is there a more exotic solution that would let me trigger the UpdatePanel from client script? I would need to be able to somehow pass the CommandArgument from the specific button that was clicked...
FYI, I worked around this problem using the approach described here:http://weblogs.asp.net/rajbk/archive/2007/01/21/refresh-updatepanel-via-javascript.aspx
I used SuppressHeaderPostBasks="true" on the Accordion, then for each Button in the Accordion Pane's header, I used the OnClientClick property to set the value of a hidden input element inside the update panel, then call the __doPostBack method pointing at that element. In the codebehind, I trapped the Change event of the hidden input element and did my processing.
I have an updatepanel inside an Accordion and I think you might have the solution for my problem, but I don't understand you process.
I would be grateful if you could help me.
Here's my code;
codebehind
protectedvoid Page_Init(object sender,EventArgs e){
Accordion1.FindControl("nothing");LinkButton UserLink = Accordion1.FindControl("UserLink")asLinkButton;
ScriptManager.GetCurrent(this.Page).RegisterAsyncPostBackControl(UserLink);//Creates a new async trigger
AsyncPostBackTrigger trigger =newAsyncPostBackTrigger();//Sets the control that will trigger a post-back on the UpdatePanel
trigger.ControlID ="UserLink";//Sets the event name of the control
trigger.EventName ="Click";//Adds the trigger to the UpdatePanels' triggers collection
UpdatePanelUser.Triggers.Add(trigger);
}
protectedvoid Page_Load(object sender,EventArgs e){
}
protectedvoid UserLink_Click(object sender,EventArgs e){
//UpdatePanel getUserPanel = UserPanel.FindControl("UpdatePanelUser") as UpdatePanel;
//ScriptManager.GetCurrent(this.Page).RegisterAsyncPostBackControl(getUserPanel);
String userPanelPath ="~/CMS/_admin/_components/CMS_controls/admin_controls/UserPanel.ascx";Control userPanel = Page.LoadControl(userPanelPath);PanelUser.Controls.Add(userPanel);
UpdatePanelUser.Update();
}
aspx
<ajaxToolkit:AccordionID="Accordion1"runat="server"HeaderSelectedCssClass="AdminPanelHeaderSelected"RequireOpenedPane="false"SuppressHeaderPostbacks="true"SelectedIndex="0"HeaderCssClass="AdminPanelHeader"ContentCssClass="AdminPanelContent"FadeTransitions="true"FramesPerSecond="40"TransitionDuration="250"AutoSize="none">
<Panes>
<ajaxToolkit:AccordionPanerunat="server"ID="Home">
<Header>
<ahref=""onclick="return false;">Home</a>
</Header>
<Content>
</Content>
</ajaxToolkit:AccordionPane>
<ajaxToolkit:AccordionPanerunat="server"ID="UserPanel">
<Header>
<asp:LinkButtonID="UserLink"runat="server"OnClick="UserLink_Click">User panel</asp:LinkButton>
</Header>
<Content>
<asp:UpdatePanelID="UpdatePanelUser"runat="server"UpdateMode="Conditional">
<ContentTemplate>
<asp:PanelID="PanelUser"runat="server">
</asp:Panel>
</ContentTemplate></asp:UpdatePanel>
</Content>
</ajaxToolkit:AccordionPane>
<ajaxToolkit:AccordionPanerunat="server"ID="STATS">
<Header>
<ahref=""onclick="return false;">Statistics</a>
</Header>
<Content>
</Content>
</ajaxToolkit:AccordionPane>
<ajaxToolkit:AccordionPanerunat="server"ID="GroupEmails">
<Header>
<ahref=""onclick="return false;">Group Email</a>
</Header>
<Content>
</Content>
</ajaxToolkit:AccordionPane>
<ajaxToolkit:AccordionPanerunat="server"ID="Errors">
<Header>
<ahref=""onclick="return false;">Error reporting</a>
</Header>
<Content>
</Content>
</ajaxToolkit:AccordionPane>
</Panes>
</ajaxToolkit:Accordion>
Thanks.
How do a reset the contents of a ModalPopup that has been closed (using the .Hide() method or by clicking the cancel button) to it's initial state (at page load)?
I am using a ModalPopup control that contains a UserControl that allows users to search for records in a database. If they find a match, they can click the 'Select' link in the GridView (where the subsequent event handler calls the ModalPopup.Hide() method). They can also click on the Cancel button to close the popup if they don't find what they are looking for.
Everything is working perfectly, except after the ModalPopup has been used once, subsequent use shows the ModalPopup in the exact state it was when it was closed, either by the .Hide() method or the cancel button.
Is there a way around this?
If its a usercontrol in the modalpopup why not create a public reset method in the usercontrol to set all the values back to "" or whatever needs to be done. You could call that right before your .hide(). It sounds like the viewstate of the controls are on. You may be able to kill viewstate on your usercontrol or set initial values, but that could potentially cause problems depending if your user control posts back a bunch of times.
HTH,
AjaxButter
I have started down the road of creating a .ResetForm() method for the user control and will see if that works.
I am hopeful that your suggestion about disabling the ViewState will work, since ideally the ModalPopup should be at it's initial state whenever it's loaded and this would involve the least amount of effort (and code to test). The only issue here might be the use of UpdatePanels for partial-page postbacks (both in the main page on in the popup), so it might not work as hoped.
I guess my best option will be to leave the ModalPopup.TargetID property blank (if it's not required) and handle showing the popup from a button Click() event that resets the UserControl first.
Thanks for the assistance.
Creating a reset event in the UserControl and calling it after certain events works for simple controls (manually created and handled forms). There are still some issues remaining...
Trapping the cancel button click event and performing a reset there causes a full page refresh since it's not wired up through the ModalPopupExtender control (and it can't be part of the UpdatePanel in the popup). Maybe I'm doing something wrong here?
If the ModalPopup contains a UserControl with a FormView (for inserting & updating), the data remains as is after the cancel button is clicked. I tried disabling the ViewState, but since the page has not been refreshed, the FormView stays the same. I also tried creating a _Click() method for the cancel button, but the event doesn't seem to get called for some reason.
Do I have to do some funky client-side scripting to get this to work?
Nevermind... I did some more playing and figured out what I was doing wrong. Staring at it for too long sometimes prevent you from seeing the forest through the trees!
If I moved the cancel button into the UpdatePanel in the popup (and left the ModalPopupExtender.CancelControlID property blank), then this started to work as hoped (without the full page refreshes).
Resetting the FormView inside the UserControl turned out to be as simple as calling for the FormView.ChangeMode() method and setting it to the default mode (insert in this case) and then calling the DataBind() method (may not be needed?).
If anyone else agrees, please mark this post as an answer.
I need to be able to create multiple updatepanels which have a link button in them. I have no idea how many updatepanels I'm going to have which have link buttons as the data coming back is from a database. Right now I'm taking the data from a database and putting that into a datalist.
It all works great until I wanted to add a updatepanel to it; then it said the updatepanel cannot be used in that context. So, if it cannot be as simple as what I tried below, how do I dynamically create an updatepanel for each row of data returned from the database?
Each row in the database has a unique ID so the ID of the linkbutton and the asyncpostbacktrigger controlid could be assigned that unique ID.
This works fine without adding updatepanel:
<asp:ScriptManager ID="ajaxClientComponentMgr" EnablePartialRendering="true" runat="server">
<Services>
<asp:ServiceReference Path="~/AjaxWebService.asmx" InlineScript="true" />
</Services>
<Scripts>
<asp:ScriptReference Path="~/Javascript/ajaxJScript.js" />
</Scripts>
</asp:ScriptManager>
<asp:DataList ID="DataSource_Stories_Display" runat="server">
<ItemTemplate>
<asp:Table CssClass="stories_table_block" runat="server">
<asp:TableRow runat="server">
<asp:TableCell CssClass="stories_right_content" runat="server">
<span class="stories_content_header"><%#DataBinder.Eval(Container.DataItem, "Title Name:")%></span><br />
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</ItemTemplate>
</asp:DataList>
This complains of being "not in this context" after adding updatepanel:
(Note: unique_id_for_this_link added just to show that each iteration would have a unique number at that location)
<asp:ScriptManager ID="ajaxClientComponentMgr" EnablePartialRendering="true" runat="server">
<Services>
<asp:ServiceReference Path="~/AjaxWebService.asmx" InlineScript="true" />
</Services>
<Scripts>
<asp:ScriptReference Path="~/Javascript/ajaxJScript.js" />
</Scripts>
</asp:ScriptManager>
<asp:DataList ID="DataSource_Stories_Display" runat="server">
<ItemTemplate>
<asp:Table CssClass="stories_table_block" runat="server">
<asp:TableRow runat="server">
<asp:TableCell CssClass="stories_right_content" runat="server">
<span class="stories_content_header"><%#DataBinder.Eval(Container.DataItem, "Title Name:")%></span><br />
<asp:UpdatePanel ID="something_unique_id_for_this_panel" ChildrenAsTriggers="False" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<asp:LinkButton ID="unique_id_for_this_link" OnClientClick="paneDataRequest();return false;" CssClass="story_link" runat="server">Click Me</asp:LinkButton>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="unique_id_for_this_link" />
</Triggers>
</asp:UpdatePanel>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</ItemTemplate>
</asp:DataList>
UPDATE: Okay...Swapping where UpdatePanel was located fixed part of the issue.
UpdatePanel, if it is outside of Datalist will work as follows:
<asp:UpdatePanel ChildrenAsTriggers="False" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<asp:DataList ID="DataSource_Stories_Display" runat="server">
<ItemTemplate>
<asp:Table CssClass="stories_table_block" runat="server">
<asp:TableRow runat="server">
<asp:TableCell CssClass="stories_right_content" runat="server">
<span class="stories_content_header"><%#DataBinder.Eval(Container.DataItem, "Title Name:")%></span><br />
<asp:LinkButton OnClientClick="paneDataRequest();return false;" CssClass="story_link" runat="server">Click Me</asp:LinkButton>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</ItemTemplate>
</asp:DataList>
</ContentTemplate>
<Triggers>
</Triggers>
</asp:UpdatePanel>
New problem discovered!
If I try to assign an ID to the asp:LinkButton (a unique value for each row of database data) I just end up getting all types of errors:
<asp:LinkButton id="some_unique_id" OnClientClick="paneDataRequest();return false;" CssClass="story_link" runat="server">Click Me</asp:LinkButton>
If the ID is omitted, it works fine...not what I'm after.
Next Question:
How do I assign a unique ID number to LinkButton? If I cannot assign it, how can I determine the IDs which are assigned to it so that I can build the <triggers></triggers> part of the updatepanel control?
UPDATE 2:
Visual Studio .Net Beta 2, using the scenario above from second post, does not auto-generate IDs (when you view source of the generated page) for:
<asp:LinkButtonOnClientClick="paneDataRequest();return false;"CssClass="story_link"runat="server"></asp:LinkButton>
Visual Studio .Net Beta 2, using the scenario above from second post, does auto-generate name values (although not IDs) for buttons such as:
<asp:ButtonOnClientClick="paneDataRequest();return false;"Text="default"runat="server"></asp:Button>
Hi I have javascript calling a webservice which is loading a dataset from an onclick event, which opens a popup window collects information and returns to the main page. I want to just load the data collected from the popup and update the dropdownlist without a postback.
The dataset is loaded and ready to go, I'm not sure how to bind the ds to the dropdown at this point.
Thanks in advance for the help!
Hi
You have an option of populating the DDL using javascript itself by loading the select with options array. But at the cost of not known to the server and not present in view state. If that's okay you can go with that otherwise the good deal would using ajax to load
How would I use ajax to load the dropdownlistbox?
Hi,
Based on my understanding, you opens a popup window to collects information,then you load a dataset based on those information.Where are you loading the dataset? In the popuppage?In the main page?
If you load the dataset in the popup page, It is hard to post your dataset to your main page.
If you just post the collected information to your main page and then load your dataset in the main page, you can do it like this:
place your dropdown contorl in a updatepanel;
pass the collected infoemation to the main page and fire a Ayncpostback to the updatepanel(Loading data from popup to parent window without refreshing the parent window.)
Best Regards,
The update panel will not work as I have 8 independent buttons that need to re populate the different dropdowns on the Main Screen when the Popup closes. Not all the independent buttons are effect the dropdowns at the same time. Is there an extender available that can perform the databind?
Thanks in advance
8independent buttons?
I don't think it is a good design.
Would you please change it?
As far as I know, still no such extender that can perform the databind in that way.
I will create my own extender. Comments on the design are not appreciated, as they are client dictated, and real world...
Hi,
Just a comment...
I think you can pass 8 values to the main page by using "window.opener.document.forms["form1"].elements["xxx"].value = ''".
Happy coding:)
I have this in my page
<div>
<asp:ButtonID="RefreshAreasButton"runat="server"OnClick="RefreshAreasButton_Click"Text="Refresh"/>
<asp:ButtonID="DeleteAreaButton"runat="server"Text="Delete"/>
<!-- Delete popup -->
<asp:PanelID="DeletePanel"runat="server"CssClass="modalPopup"Style="display: none"Height="115px"Width="255px">
<asp:TextBoxID="TextBox1"runat="server"Text="Delete Selected Areas"></asp:TextBox>
<asp:ButtonID="DeleteOKBtn"runat="server"Text="OK"OnClick="DeleteOKBtn_Click"/>
<asp:ButtonID="DeleteCancelBtn"runat="server"Text="Cancel"/>
</asp:Panel>
<cc1:ModalPopupExtenderID="ModalPopupExtender2"
TargetControlID="DeleteAreaButton"
PopupControlID="DeletePanel"
runat="server"
BackgroundCssClass="modalBackground"
DropShadow="true"
OkControlID="DeleteOKBtn"
CancelControlID="DeleteCancelBtn"/>
</div>
I want the OK button to submit to server, but my "protectedvoid DeleteOKBtn_Click(object sender,EventArgs e)" method is never called.
What am I doing wrong?
I know you that it looks like sort of confirmation popup, but later I would like the user to enter a value in the popup, and to be able to use the value in the server - is it doable?
Am I using the right control, or can you recommend on a better way to gain that.
Thanks in advance!
Tamir
What
Remove the OkControlID="DeleteOKBtn" property, after that your button should submit back to the page.
Contrary to the documentation the OkControlID property will cause the button click to fire off thejavascript function which is defined in OnClick. The same is true for the CancelControlID property, if you do not define it the button will post back normally.
Hey,
I would like for a user to click an 'Add to Cart' Button, a message appears 'Adding Item to Cart ...', and then the message changes to 'Item added to Cart' when finished. I have under the AddToCart_Click event changing the label to 'Adding to Shopping Cart ...' then the code to actually add the item to the shopping cart and then changing the label to 'Item added to Cart.' However, only the last label is seen (Item added to Cart). Any suggestions on how to do this? Should I use 2 Update Panels? Or, how do I tell it to display both labels?
Thanks,
Beej
Hi
I am not sure about this, but please check Update progress or timer control from Ajax.Net. It may help you.
regards
Anuraj.P
I would suggest using the UpdateProgress component from the AjaxControlToolkit. What you specify in the ProgressTemplate tag of the UpdateProgress control will be visible during the callback, in your case the message 'Adding item to cart...'
SplashMan:
Hey,
I would like for a user to click an 'Add to Cart' Button, a message appears 'Adding Item to Cart ...', and then the message changes to 'Item added to Cart' when finished. I have under the AddToCart_Click event changing the label to 'Adding to Shopping Cart ...' then the code to actually add the item to the shopping cart and then changing the label to 'Item added to Cart.' However, only the last label is seen (Item added to Cart). Any suggestions on how to do this? Should I use 2 Update Panels? Or, how do I tell it to display both labels?
Thanks,
Beej
hi,
Subscribe to add_beginRequest and add_endRequest events of the Sys.WebForms.PageRequestManager like so:
<script type="text/javascript">
//<![CDATA[
var prm = Sys.WebForms.PageRequestManager.getInstance();
var displayLabel= $get("displayText");
prm.add_beginRequest(function(){
displayLabel.innerHTML = "Adding Item To Cart ...";
});
prm.add_endRequest(function(){
displayLabel.innerHTML = "Item added to Cart ...";
});
//]]>
</script>
hth
How do I add an image button to a tab dynamically at runtime so that it replicates the codebehind version :-
<
ajaxToolkit:TabPanelrunat="server"ID="tabA"HeaderText=""><HeaderTemplate><asp:ImageButtonrunat="server"ID="refreshTabA"ImageUrl="./img/Refresh.gif"OnClick="refreshTabA_OnClick"/><spanstyle="">Tab A</span></HeaderTemplate>
I am building my Tabs on my TabControl dynamically and in each of the tabs I have a ReportViewer control. (So I can display multiple reports on a page 1 tab per report), this bit works ok which adds the tab and the tab title and the report, just the image button on the tab I'm missing.
TabPanel tabPanel =newTabPanel(); // Create Tab dynanically
tabPanel.ID =
"tab" + ReportName;tabPanel.HeaderText = DisplayName;
ReportViewer reportViewer =newReportViewer(); // Create report
tabPanel.Controls.Add(reportViewer);// Add report dynamically to TabTabContainer1.Tabs.Add(tabPanel);// Add Tab to Tab ContainerAfter much searching on the web I think I have found a solution
// Create Tab dynanically
TabPanel tabPanel =newTabPanel();// Assign a new header template with the image and report Info which is a simple
class holding ReportName and DisplayName
tabPanel.HeaderTemplate =
newDynamicallyCreatedTemplate(ListItemType.Header, reportConfig);Then create your Template Class
1 public class DynamicallyCreatedTemplate : ITemplate
2 {
3 //A variable to hold the type of ImageButton.
4 ListItemType _itemType;
5 ReportInfo _reportInfo;
6
7 //Constructor where we define the template type and column name.
8 public DynamicallyTemplate(ListItemType itemType, ReportInfo reportInfo)
9 {
10 //Stores the template type.
11 _itemType = itemType;
12 _reportInfo = reportInfo;
13 }
14
15 public void InstantiateIn(System.Web.UI.Control container)
16 {
17 try
18 {
19 switch (_itemType)
20 {
21 case ListItemType.Header:
22
23 // First Add the Image Button
24 ImageButton imgButton =new ImageButton();
25 imgButton.ID ="img" + _reportInfo.ReportName;
26 imgButton.ImageUrl = @."./img/Refresh.gif";
27 imgButton.Click +=new ImageClickEventHandler(refreshTabA_OnClick);
28 imgButton.ToolTip ="Refresh";
29 container.Controls.Add(imgButton);
30
31 // Then add the Tab Label
32 Literal header_ltrl =new Literal();
33 header_ltrl.Text =" " + _reportInfo.DisplayName;
34 container.Controls.Add(header_ltrl);
35 break;
36 case ListItemType.Item:break;
37 }
38 }
39 catch
40 {
41 }
42 }
43 }
hi all,
i have 3 tabs in my tabcontainer generated dynamically.
for each tab header i need to have a different active image and deactive image
eg
tab1 (active1.gif, inactive1.gif)
tab2 (active2.gif ,inactive2.gif)
has anyone tried out this.
Pls help
Thanks.
I have created a modal popup to show up during page load. It is my logon dialog box. Anyways, I have set the OkControl property to my logon button to execute some codes through the ModalPopupExtender control staticly and dynamically through Page_Load but both didn't work..
What is my problem?
Thanks!
Ok, I follow the flow from this person website.http://blogs.vertigosoftware.com/alanl/archive/2006/07/25/Creating_a_Confirmation_Using_the_ModalPopup_Extender.aspx It works with a button.
I want to use the SHOW event when the page load but it doesn't work. It seem like it is not rendering the javascript or couldn't find it.
What is my problem?
Hi,
Have you tried this link?
http://blogs.msdn.com/phaniraj/archive/2007/02/20/show-and-hide-modalpopupextender-from-javascript.aspx
Hi All,
I must say I'm finding the move to Beta 1 frustrating.. Love to see documentation for something other than update panels :)
Can someone give me a hand with a simple UI event handler?
My Script Manager declaration looks like this:
<asp:ScriptManagerID="ScriptManager1"runat="server">
<Scripts>
<asp:ScriptReferenceAssembly="Microsoft.Web.Preview"Name="Microsoft.Web.Resources.ScriptLibrary.PreviewScript.js"/>
<asp:ScriptReferenceAssembly="Microsoft.Web.Preview"Name="Microsoft.Web.Resources.ScriptLibrary.PreviewGlitz.js"/>
<asp:ScriptReferenceAssembly="Microsoft.Web.Preview"Name="Microsoft.Web.Resources.ScriptLibrary.PreviewDragDrop.js"/>
</Scripts>
</asp:ScriptManager>
Problem code :
findButton =new Sys.Preview.UI.Button($get('FindButton'));
findButton.click.add(onFindLocation); // this line fails
Cheers!
Tim
Hi,
findButton.add_click(onFindLocation);
When back button pressed in browser, updatepanel updates again...
I need catch updatepanel content in client...
can i?
I have an UpdatePanel that update in client with delay. i need catch content of this UpdatePanel in client, because this content is shared in all pages.
Best sample for resolving this problem is Yahoo Mail... update panle update all contet in all CallBack... i need catch contents in client...
Please help me... tnx
i need help
plz......
Take a very simple example, i have a button inside the update panel along with other controls and i have a textbox on the page.What i want is that when i click the button inside the update panel,it should update the textbox which is present outside the update panel.How can i do this?
To my knowledge you cannot update any control outside of the update panel. If you want to update the control move it inside the update panel.Do you want to modify the text box with server-side code? If so, put it in its own UpdatePanel. Set the UpdateMode on the panel to Conditional. Then you can either add the button in the other UpdatePanel as an AsyncPostBackTrigger to the new UpdatePanel or invoke the Update method on the new UpdatePanel in your button's Click event handler.
If you want to modify the text box on the client, you're going to have to write JavaScript.
Can you please tell me what javascript should i write for the sition i mentioned in the above example.
I am not getting the idea using javascript for a control inside the update panel.
Are you sure you need to write JavaScript? I gave you the steps to modify the text box using purely server-side code by using a second UpdatePanel control. I highly recommend you read theUpdatePanel tutorials and then re-read what I suggested. This path doesn't require JavaScript, but does require a round-trip to the server which is where your code will be executing.
If you do need to use JavaScript, you're going to need to handle the button's click event, modify the other control, and then prevent the default action for clicking the button from occurring (if necessary). This would all be done on the client so wouldn't require a round-trip to the server, but involves learning JavaScript and the DOM API (which you should want to learn as a web developer, anyways).
How can retrieve data dynamically into the <content> tag of <Accordion pane> when clicking a button which is in the <Header> tag of< Accordion pance>
Plase let me know if any possibility
Thanks,
Eswar
Hi,
I'm not sure if I understood you correctly. please try the sample below or feel free to let me know if I misunderstood you:
<%@. Page Language="C#" %><!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) { } void btnCommand(object sender, CommandEventArgs e) { int index = int.Parse(e.CommandArgument.ToString()); AjaxControlToolkit.AccordionPane ap = accordion1.Panes[index]; TextBox tb = ap.ContentContainer.FindControl("TextBox" + (index+1).ToString()) as TextBox; tb.Text = DateTime.Now.ToString(); }</script><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"> <title>Untitled Page</title></head><body><form id="form1" runat="server"><asp:scriptmanager ID="Scriptmanager1" runat="server"></asp:scriptmanager><div> <input id="Button1" type="button" value="button" onclick="addTab();"/> <ajaxToolkit:Accordion runat="server" ID="accordion1"> <Panes> <ajaxToolkit:AccordionPane runat="server"> <Header> <asp:LinkButton ID="LinkButton1" runat="server" CommandArgument="0" OnCommand="btnCommand">LinkButton1</asp:LinkButton> </Header> <Content> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> </Content> </ajaxToolkit:AccordionPane> <ajaxToolkit:AccordionPane ID="AccordionPane1" runat="server"> <Header> <asp:LinkButton ID="LinkButton2" runat="server" CommandArgument="1" OnCommand="btnCommand">LinkButton2</asp:LinkButton> </Header> <Content> <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox> </Content> </ajaxToolkit:AccordionPane> <ajaxToolkit:AccordionPane ID="AccordionPane2" runat="server"> <Header> <asp:LinkButton ID="LinkButton3" runat="server" CommandArgument="2" OnCommand="btnCommand">LinkButton3</asp:LinkButton> </Header> <Content> <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox> </Content> </ajaxToolkit:AccordionPane> </Panes> </ajaxToolkit:Accordion> </div></form></body></html>
Hi,
Hopefully this is a simpe question! I have a couple of UpdatePanels on my page, and at the top a "Save all" button that calls the "Update" method on each of these updatepanels which gets them to save their contents. Immediatly after doing the updates, I need to render a graph of the data. The problem I have is that the UpdatePanel "updates" are all asynchronous, so my graph doesn't always pick up the newly saved information - because its still being saved while the graph is created.
What I need to do is either get the UpdatePanels to update synchronously, or have some way to fire server-side code once they have finished.
Is this possible?
Thanks!
Matt
Hi,
You cann't process multi-Asyncpostbacks at the sametime, You can process them one by one when you click "Save all".
Following is a demo:
<%@. Page Language="C#" %>
<!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 Button1_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label1.Text = "The time is: " + DateTime.Now.ToString();
}
protected void Button2_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label2.Text = "The time is: " + DateTime.Now.ToString();
}
protected void Button3_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label3.Text = "The time is: " + DateTime.Now.ToString();
}
</script><html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>UpdatePanelTutorialIntro1</title>
<style type="text/css">
#UpdatePanel1 {
width:300px; height:100px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div style="padding-top: 10px">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
Processing…
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label><br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
<br />
<br />
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label><br />
<asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="Button" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
<br />
<br />
<asp:UpdatePanel ID="UpdatePanel3" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label3" runat="server" Text="Label"></asp:Label><br />
<asp:Button ID="Button3" runat="server" OnClick="Button3_Click" Text="Button" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
<br />
<br />
</div>
</form><script type="text/javascript" language="javascript">
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
var thebutton;
function BeginRequestHandler(sender, args)
{
$get('UpdateProgress1').style.display = 'block';
thebutton = args.get_postBackElement();
thebutton.disabled = true;
}
function EndRequestHandler(sender, args)
{
$get('UpdateProgress1').style.display = 'none';
thebutton.disabled = false;
var str = thebutton.id
if(document.getElementById("Button" + (parseInt(str.substring(6, str.length)) + 1)))
document.getElementById("Button" + (parseInt(str.substring(6, str.length)) + 1)).click();
}
</script></body>
</html>
Best Regards,
Thanks very much. Your example shows me that I can call the buttons "click" manually using the EndRequestHandler, to then go and call the next one. I think I can use that information to achieve what I was after :)
I have a similar situation. You'll have to register two events EndRequest, InitializeRequest and queuing system.
Please refer tohttp://forums.asp.net/p/1167326/1944939.aspx#1944939 for the code example.
Let me know if this helped.
Hello,
I have a problem.
How can I stop the modal popup from disappearing when a postback occurs.
For example, if I have a button on the modal "form", a click makes it dissappear.
Help!
Thanks!
UPDATE:
I just tried wrapping the postback controls in an updatepanel.
Seems to work so far...this the recommended way?
Hello again ! I have a normal page, with a search button, that open a popup(dhtml-div-iframe) !
Using AJAX PRO:
In that IFRAME(popup) I have a GridView with a LinkButton that calls a JS function passing a selected key!
The JS Function call a server function passing that key!
The server funtion get a class´s object and pass to JS function...
The JS function Fill all fields from my MAIN form and close POPUP !
How can I do that using ATLAS?
[]´s
No help ?!?
:(
Not an expert, but here are a few suggestions:
Take a look at the atlas control toolkit,
For the pop up, there's a pop up extender. To fill the GridView async, you can use a web service. Actually, you don't have to. Just putting the GridView in an UpdatePanel with a PartialRendering ScriptManager will let you re-fill it with any query you'd like.
And by the way, there's also a ModalPopUp extender, might fit your needs better.
How can i Put close button inside the the popUp extender?
I want that when the popUp control appears there is close button on the popUp or in the panel which is extended by the popUp extender.
Once the close button is clicked the popUp control is hide. Thnks
Hi,
If you are using ModalPopup Extendar then its simple add the following property:
CancelControlID="Button1"
and for PopupControlExtender check out this:
http://weblogs.asp.net/lkempe/archive/2007/01/28/login-control-in-an-asp-net-ajax-toolkit-popupcontrolextender-with-a-close-button.aspxthanks
Thanks... I will try it...
Hi there,
I'd like to be able to handle a right-click in a region that has the floatingBehavior. Unfortunately, the fact that floatingBehavior allows the region to be dragged via the right (context) mouse button as well as the left is interfering. (In fact, even if it weren't causing problems for me, having the regions draggable by the right mouse button breaks a lot of the UI conventions I'm hoping to capitalise on.)
So, I'd like to stop the right mouse button from dragging. How can I do this?
There's no built-in option, but that's OK. I'm happy to inherit and override the floatingBehavior class, but the important bits don't seem to be overridable (unless I'm doing it wrong) and anyway floatingBehavior is sealed.
How can I accomplish this?
Many thanks,
Geoff
1. You can't inherit from the class and would have to rewrite it. I WISH!!!
2. Button definition within browser means different things on different browsers, systems, no real way to tell which button was pressed.
3. If you write your own you can do this only for some of the browsers and os. From memory button and which returns 0 on some browsers for left, on some it returns 1, no real way to tell which is clicked for all browsers.
4. Whatever you're trying to capitalize on assumes there is more than 1 button. What abour our Mac friends? (ahem, I admit it I use a Mac on occassion).
Hi,
1:. I was afraid of that.
2, 3 and 4: I'm not convinced. The DOM specifies the button used for events (http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-MouseEvent-button) and says how to handle buttons being swapped etc. And isn't one of the main drivers of Atlas being able to abstract away browser differences?
Fundamentally though I just don't think allowing drags by any button other than the left one is proper for many UIs. For instance, you can't drag the browser window in XP by grabbing the title bar with the right mouse button. You can't drag and drop messages in Outlook with the right mouse button. You can't drag and drop text in this very edit control with the right mouse button. All those actions only work with the left mouse button (with the right mouse button operating a context menu sometimes). I just want to be consistent with those expected behaviors.
I'm not against writing code to solve this, I'd just rather not have to reimplement the whole floatingBehavior for this one change.
Geoff
Like I said you won't be able to do this for every browser in every type of event. Here's a snippet that works for most browsers but I would only use it if you have strict requirements. I would also be careful about referring to buttons as left and right as some operating systems give you the option to switch left and right button (think left handed users) so better names are primary, secondary. The tertiary is either the 3rd button or the mouse wheel, no real definition here. Here's what you'd use inside your event.
var btn = Event.Which(e);
if (btn != Button.Primary) return;
Type.createEnum('Button','None', 0,'Primary', 1,'Secondary', 2,'Tertiary', 3);
I've to provide the user in my company with an editable gridview. When clicking on "edit" button there should be available a textbox with the ability to enter a date. This datevalue should come from a calendar.
I would like to have the calendar popuped at the bottom of the textbox.
I looked to the SampleWebsite of AtlasControlToolkit and had success to build a new aspx page with a textbox, a calendar and a PopupControlExtender.
For my question I also searched a lot in the internet and in this forum, but I didn't find the solution which works in my WebApplication.
I develop in VB with Visual Studio .NET 2005, SQL 2005 and have the newest Version of Atlas, AtlasControlTookit and AtlasControlExtender installed.
Could anybody help me?
Thanks a lot.
Paul
I'm not sure I understand your question, but generally you just put the Textbox and PopupControlExtender into the EditTemplate, and I think you can put the calendar control outside of the GridView and just reference it.
Hi, thanks for your advise.
Does this work equally well with a calender control in the footer? My code is as follows.
<asp:GridView ID="gvMisc" runat="server" AutoGenerateColumns="False" DataKeyNames="ID" DataSourceID="odsTrans" EmptyDataText="No data" ShowFooter="True" OnRowCommand="gvMisc_RowCommand" OnRowDataBound="gvMisc_RowDataBound">
<Columns>
<asp:TemplateField HeaderText="From" SortExpression="dtFrom">
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("dtFrom") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label33" runat="server" Text='<%# Bind("dtFrom", "{0:dd MMM yyyy}") %>'></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:TextBox ID="txtFrom" runat="server" CausesValidation="True" ValidationGroup="Validation_Footer"></asp:TextBox>
<atlas:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<atlasToolkit:PopupControlExtender ID="PopupControlExtenderFromDate" runat="server">
<atlasToolkit:PopupControlProperties TargetControlID="txtFrom" PopupControlID="calFrom" Position="Right" />
</atlasToolkit:PopupControlExtender>
</ContentTemplate>
</atlas:UpdatePanel>
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:Calendar ID="calFrom" runat="server" BackColor="White" BorderColor="#999999"
CellPadding="4" DayNameFormat="Shortest" Font-Names="Verdana" Font-Size="8pt"
ForeColor="Black" OnSelectionChanged="calFrom_SelectionChanged" Width="160px">
<SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" />
<TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" />
<SelectorStyle BackColor="#CCCCCC" />
<WeekendDayStyle BackColor="#FFFFCC" />
<OtherMonthDayStyle ForeColor="#808080" />
<NextPrevStyle VerticalAlign="Bottom" />
<DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" />
<TitleStyle BackColor="#999999" BorderColor="Black" Font-Bold="True" />
</asp:Calendar>
and on the server
protected void calFrom_SelectionChanged(object sender, EventArgs e)
{
PopupControlExtender pce = (PopupControlExtender)gvMisc.FooterRow.FindControl("PopupControlExtenderFromDate");
pce.Commit(calFrom.SelectedDate.ToString("dd MMM yyyy"));
}
Going For AJAX