jQuery modal pop-up doesn't pick up the values in click handler

I am using the Basic Modal Dialog in my ASP.NET web application. In the pageload event handler, it correctly binds the data to the text boxes which are inside the modal popup. But when I try to retrieve the values from the text boxes in the buttonclick event handler, it just returns empty strings as the value.

The code is basically like this have text boxes inside a div which pop-u开发者_StackOverflow中文版p:

<asp:TextBox ID="fname" runat="server"></asp:TextBox>

In pageload:

fname.Text = customer.firstName; this is working

In button click:

protected void BtnSaveinfoClick(object sender, EventArgs e)
{
    var firstname = fname.Text.Trim();// this taking values as ""
}

I did make a breakpoint in the buttonclick. when i hover over the fname text box with the firebug it showing me the value is there.

<input id="MainContent_cphMain_PersonalInfo1_fname" type="text" value="Andrew" name="ctl00$ctl00$MainContent$cphMain$PersonalInfo1$fname"> 

Any ideas will be helpful.

You have to use the appendTo option to append the dialog to the form for ASP.NET events to fire:

appendTo [String:'body']

The jQuery selector to append the elements to. For ASP.NET, use 'form'.

NOTE: jQuery UI Dialogs get appended the to the body tag by default. All .NET controls must be rendered inside the form tag to work properly. For an exercise, try adding any control(ie: asp:textbox) to a page that has runat="server", outside of the form tag and see what ASP.NET has to say about it.

Have you checked through your Page_Load and other scripts to make sure that you are not clearing fname at any point before it reaches the event?

This is what happenes Fix your postbacks in Modal forms