Asp.net button event inside jQuery FaceBox

Question

I am using jQuery FaceBox to show a text box, a dropdown and a button. The user can write text in a text field, select a value in ddl abd, click a button. This calls the code in code. FaceBox looks great, and the content in it is also in order. In addition, a button event is fired. This is the code for the button event handler:

protected void Button1_Click(object sender, EventArgs e) { _favorit = new Favoritter(); ListItem fav = ddl_favoritter.SelectedItem; _favorit.FavoritterFolderID = int.Parse(fav.Value); //_favorit.FavoritterFolderID = Convert.ToInt32(ddl_favoritter.SelectedItem); _favorit.FavoritterNavn = txt_favoritNavn.Text; _favorit.FavoritterUserID = UserID; _favorit.FavoritterUrl = HttpContext.Current.Request.Url.ToString(); FavoritterManager.InsertFavoritter(_favorit); } 

A business object is created, and its properties are set with the values ​​read from the controls. Then the object is inserted into the database, which works fine. The problem is that the values ​​of the text box and the drop-down menu are not set properly. The text box value is empty, and the selected ddl value is always 1, even if I write in the text box and select another ddlitem before I click the button. Ddl loads as follows:

 if (!Page.IsPostBack) { _favoritter = FavoritterFolderManager.GetFavoritterFolderByUser(UserID); ddl_favoritter.DataSource = _favoritter; ddl_favoritter.DataBind(); } 

I tried to put this code outside the if (! Page.IsPostBack), and also populate it with objectdatasource, still the same problem. This is similar to the “reset” controls when I press the button, and I don't think it has anything to do with FaceBox, since all it does is show a div containing the controls ... Then, it can ... any ideas?

This is the code on the aspx page:

 <div id="showme" style="display:none;"> Add to favourites.<br /> <br /> <p> Title:&nbsp;<span><asp:TextBox ID="txt_favoritNavn" runat="server"></asp:TextBox></span></p> <p> select folder:&nbsp;<span><asp:DropDownList ID="ddl_favoritter" runat="server" DataTextField="FavoritterFolderNavn" DataValueField="FavoritterFolderID" AppendDataBoundItems="true"> </asp:DropDownList> </span> </p> <br /> <asp:Button ID="Button1" runat="server" Text="Gem" onclick="Button1_Click"/> </div> 

Answer 1

I found the answer in this thread:

Person with commas to enter

Thanks guys and thanks to Nick Craver for your help.

Answer 2

You need to have code that fills the text box and selects a drop-down element inside the if (! IsPostBack) block, because the page load event is fired before the button event again (see ASP.NET Page Life Cycle for more information on this). Have you tried to enable view state in the control? This may be part of the problem.

Answer 3

Edit

 $('body').append($.facebox.settings.faceboxHtml) 

to

 $('form').append($.facebox.settings.faceboxHtml) 

Answer 4

The problem is most of these controls, not just FaceBox, are attached to the body by default. The jQuery UI dialog box also runs.

See this fix question: JQuery Facebox Plugin: get it inside the form tag

When things happen outside of the <form> , they are disconnected from how ASP.Net works. When you clicked the submit button, the values ​​from these inputs were not inside the form, therefore they were not sent to the server ... therefore you do not see the value.

This is a quick answer to this question, loan Kevin Sheffield :

poking around in facebox.js I came across this line in the init function (settings) ...

 $('body').append($.facebox.settings.faceboxHtml) 

I changed it to ...

 $('#aspnetForm').append($.facebox.settings.faceboxHtml)