Input in tr>td>input is not processed with jquery serialize

Question

I have found some solution to an problem I face under the last solution provided under this link: Create a HTML table where each TR is a FORM

Anyhow, here are some fragments from my code: HTML:

<tr class="a1td">
    <td class="style1">12</td>
    <td class="style1">i_pinz/td>
    <td class="style1">2013-05-12</td>
    <td class="style1">2013-05-12</td>
    <td class="style1"><input type="text" name="name1" value="val1" id="name1" size="50" maxlength="50" placeholder="exampletext"  /></td>
    <td class="style1"><input type="text" name="name2" value="val2" id="name2" size="20" maxlength="32" placeholder="example2" class="cleanInput"  /></td>
    <td class="style1"><input type="text" name="name3" value="" id="name3" size="20" maxlength="32" placeholder="example"  /></td>
    <td class="style1"><input type="text" name="name4" value="val4" id="link" size="50" maxlength="255" placeholder="example"  /></td>
    <td class="style1"><input type="text" name="name4" value="0" size="4" /></td>
    ... some links and images
    <td><button name="apply" type="submit" class="SubmitRow" ><img src="accept.png" alt=""/></button>
<input type="hidden" name="ID" value="xx" />
    </td>
<tr>

The JavaScript:

<script type="text/javascript">
$(document).ready(function(){
  $(".SubmitRow").click(function()
  {
     console.log('inside submit function');
     var form = '<form><table><tr>' + $(this).closest('tr').html() + '</tr></table></form>';
     var serialized = $(form).serialize();
     console.log(serialized);
     $.post("quickEdit", serialized); 
   });
});        
</script>

So, my issue is now: if I update the field name3 and press the button, the function is called as supposed and wanted, anyhow if I look the console-log the field name3 is not presenting the updated value. Hence the code at the server-side is not working.

I use latest jQuery 1.9.x and the table is not enclosed inside a <form></form>.

Any suggestions are welcome.

Answer 1

Try this -

var serialized = $(form).find('form').serialize();

OR

var serialized = $(this).closest('tr').serialize();