title: Pass parent form and modal window data to server with AJAX
body: <p>I have a dynamic form page with multiple table rows where the user updates the status by selecting the checkbox for the rows to update.  When the update button is clicked, I open a jquery modal window for the user to select a status from a dropdown list and enter comments.  I am able to pass the modal window data to my servlet through AJAX but I don't know how to get the checkbox values.</p>
  
  <p>How can I pass the checkbox values from the parent form and the additional data from the modal window to my Java servlet so I can update the appropriate database records?  I would like to use AJAX so the parent form doesn't reload for the user.</p>
  
  <p>Thanks in advance!</p>
  
  <p><strong>Modal window and AJAX update:</strong></p>
  
  <pre><code>$(function() {
      $("#dialog-form").dialog({
          autoOpen: false,
          height: 'auto',
          width: 'auto',
          modal: true,
          buttons: {
              "Update Status": function() {
                  dataString = $("#statusForm").serialize();
  
                  $.ajax({
                      type: 'POST',
                      url: 'updateStatus',
                      data: dataString,
                      dataType: 'json',
                      success: function(data) {alert(data);}
                  });
                  $(this).dialog("close");
              },
              Cancel: function() {$(this).dialog("close");}
          },
          close: function() {$(this).dialog("close");}
      });
      $("#update-status")
              .button()
              .click(function() {
          $("#dialog-form").dialog("open");
      });
  });
  </code></pre>
  
  <p><strong>EDIT:</strong></p>
  
  <p>As you can see there are 4 items checked in the background with the modal window on top asking for additional information.The items selected need to updated with the information from the modal windows.  Each checkbox has it's own unique value corresponding to it's record id in the database table.</p>
  
  <p><img src="https://i.stack.imgur.com/Egmmi.png" alt="enter image description here"></p>
  
  <p><strong>EDIT 2:</strong></p>
  
  <p>Parent form - HTML Code snippet:</p>
  
  <pre><code>&lt;form name="OptionList"&gt;
  &lt;table id="statusTable"&gt;
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;Option&lt;/th&gt;
              &lt;th&gt;Type&lt;/th&gt;
              &lt;th&gt;Timestamp&lt;/th&gt;
              &lt;th&gt;Entry Type&lt;/th&gt;
              &lt;th&gt;User Profile&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;input type="checkbox" value="19"&gt;&lt;/td&gt;
          &lt;td&gt;DO&lt;/td&gt;
          &lt;td&gt;5/14/13 4:31 PM&lt;/td&gt;
          &lt;td&gt;A&lt;/td&gt;
          &lt;td&gt;user profile&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;input type="checkbox" value="61" &gt;&lt;/td&gt;
          &lt;td&gt;DO&lt;/td&gt;
          &lt;td&gt;5/14/13 4:50 PM&lt;/td&gt;
          &lt;td&gt;A&lt;/td&gt;
          &lt;td&gt;user profile&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;input type="checkbox" value="37"&gt;&lt;/td&gt;
          &lt;td&gt;DO&lt;/td&gt;
          &lt;td&gt;5/14/13 5:03 PM&lt;/td&gt;
          &lt;td&gt;A&lt;/td&gt;
          &lt;td&gt;user profile&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;input type="checkbox" value="157"&gt;&lt;/td&gt;
          &lt;td&gt;DO&lt;/td&gt;
          &lt;td&gt;5/14/13 5:04 PM&lt;/td&gt;
          &lt;td&gt;A&lt;/td&gt;
          &lt;td&gt;user profile&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p></p>