ModalPanel - How can I us AJAX instead of postback to update database ?

I'm new to AJAX and this suite of tools. I have a page that when a user clicks a link button my ModalPanel with various input fields appears. When the user clicks the okay button I want to make an async call instead of having the page post back. I need to be able to call one of my business objects defined in C# so what is the best way to do this?

If you can provide details or even a small example I would appreciate it.

My code behind method looks like this:

void OnClick(...)

{

Broker b = new Broker();

b.name = NameTextBox.Text;

b.account = AccountTextBox.Text;

b.Save();

}

Why not just wrap the modalpopup in an updatepanel and let the page postback? It is easier then to have access to the server controls from the form and have full interaction with the other page elements during the postback in case you want to update other stuff on the page.

What benefits are you looking for by not posting back?

Jason

ModalPopup - Centering when content size change

hi,

modalPopup will recenter itself when the contents change size.

i have a gridView which may change size according to a users input. modalPopup will recenter itself, but only AFTER the user attempts to scroll the window.

is there a way to force the modal-popup to 're-evaluate' itself based on a trigger? or how do i call the resize function that it obviously has.

thank you.

Hi RomanT,

We don't have built in support for this, but you can call the_layout function on your client-side ModalPopupBehavior instance.

Thanks,
Ted

ModalPopup - Logic to databind control outside of modal

Hello All,

I am have a modal popup that appears and takes some input from a user. The user can then hit "submit" and logic behind the onclick for the submit button validates the input, and, if valid, submits that input to a database to be inserted.

this works great. I have update panels inside of the modal doing the work, and the user can submit as many entries as the want without the modal closing.

However, in the same method, after I update the database, I call another method to get new data from the database, and to re-databind the control they were looking at before the modal opened.

But the control (a listbox) does not change. It is not being databound. I even tried clearing the items from the listbox, and the items still remain.

I am not sure why the listbox is not updating from the logic. I would assume its not becuase the control is not in the same update panel, or the control is not in the modal popup. The listbox control is in its own update panel.

So I am trying to figure out how to make a control that is in another update panel, not in the modal popup update with logic triggered in the modal popup. I've thought about using the "onOKScript" in the modal popup properties to use some sort of JS to re-databind the control, but I am not sure how to do this.

Any ideas would be extreamly helpful

Thanks

-Shane

Hi Shane,

What you're describing should work. Code in an event handler invoked via oneUpdatePanel should be able to update controls in anotherUpdatePanel. Perhaps you can post a simple demo showing what's not working for you and we can take a look.

Thanks,
Ted

modalpopup & user control question

Hi all,

I hope all of you are doing well! I have an interesting situation that I wanted to get some input on.

I have a ascx usercontrol that contains about a dozen textbox and dropdown controls inside an updatepanel. It also has a few buttons that fire server side events, all contained and handled in the code behind page for the usercontrol. This usercontrol resides on a host aspx page inside another updatepanel control. Everything works fine thus far.

Now, what I would like to do is dynamically popup the usercontrol inside a modalpopup when the user clicks on a button on the host aspx page. The user would then enter the data for the dozen or so fields on the popped up usercontrol, hit update, which would invoke the server side code inside the code behind of the usercontrol and finally close the modalpopup.

Is this possible? Some insight on how I can do this would be great. Some links to code samples would be even more awesome.

Thanks so much!

Hi,

Here is a sample made according to your requirements:

1. UserControl

<%@. Control Language="C#" ClassName="WebUserControl" %><script runat="server"> protected void Button1_Click(object sender, EventArgs e) { Label1.Text = DateTime.Now.ToString(); success = true; } // this variable is used to determine if the modal popup should close public bool success = false;</script><asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" /> <br /> <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> </ContentTemplate></asp:UpdatePanel> 

2. Page

<%@. Page Language="C#" %><%@. Register src="http://pics.10026.com/?src=WebUserControl.ascx" TagName="WebUserControl" TagPrefix="uc1" %><!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) { this.PreRender += new EventHandler(default_aspx_PreRender); } void default_aspx_PreRender(object sender, EventArgs e) { if (WebUserControl1.success) UpdatePanel1.Update(); }</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> </div> <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate>    <asp:Panel ID="Panel1" runat="server" Height="50px" Width="125px"> <uc1:WebUserControl ID="WebUserControl1" runat="server" /> </asp:Panel> <asp:Button ID="Button1" runat="server" Text="Show" /> <ajaxToolkit:ModalPopupExtender PopupControlID="Panel1" ID="ModalPopupExtender1" runat="server" TargetControlID="Button1"> </ajaxToolkit:ModalPopupExtender> </ContentTemplate> </asp:UpdatePanel>   </form></body></html>

Hope this helps.

Thanks. This worked perfectly!!