[SOLVED] Form Checkboxes are not being posted when they are in a Popup Div ASP.NET C#

Issue

When I try to get form posted data from a pop-up that is within the actual form (column_1 and column_2), the data will not be available. All other ones outside of the pop-up work fine (txt_startdate and chxShowDelete).

  <script>
      $(function () {
          $("#dialog").dialog({
              autoOpen: false,
          });

          $("#opener").on("click", function () {
              $("#dialog").dialog("open");
          });
      });
  </script>

   <form id="ResourceP" runat="server">
   <input type="button" id="opener" value="Select Columns" />
        <div id="dialog" title="Column Selection">
            <table>
            <tr>
             <td><asp:CheckBox ID="column_1" runat="server" Checked="True" />ID Value</td>
             <td><asp:CheckBox ID="column_2" runat="server" />Start Date</td>
            </tr>
            </table>
        </div>

    <asp:TextBox ID="txt_startdate" runat="server"></asp:TextBox>
    <asp:CheckBox ID="chxShowDelete" runat="server" />
    <asp:button runat="server" text="Search" ID="search" OnClick="search_Click" />
  </form>

If I remove the pop-up, column_1 and column_2 are then seen in the post.

   <form id="ResourceP" runat="server">
    <asp:CheckBox ID="column_1" runat="server" Checked="True" />ID Value
    <asp:CheckBox ID="column_2" runat="server" />Start Date
    <asp:TextBox ID="txt_startdate" runat="server"></asp:TextBox>
    <asp:CheckBox ID="chxShowDelete" runat="server" />
    <asp:button runat="server" text="Search" ID="search" OnClick="search_Click" />
  </form>

Not sure why this is not working or anyway around it – any help would be greatly appreciated.

Thank you!

Solution

why this is not working

Because dialog element is moved to body by default.

      $("#dialog").dialog({
          autoOpen: false,
          appendTo: "#ResourceP"
      });

Answered By – Igor

Answer Checked By – Pedro (BugsFixing Volunteer)