jquery - serialize from a table element and not the whole form

Question

Trying to serialize just the elements from a specific table but it only returns a result if i do the whole Form

in the below code, i want to ajax just the elements in tbl2

<form>
 <input type="text" id="tb1" name="tbl1"/>
  <table name="tbl1">
   <tr><td><input type="text" name="tb2"/></td></tr>
 </table>
 <table name="tbl2">
   <tr><td><input type="text" name="tb3"/></td></tr>
   <tr><td><input type="text" name="tb4"/></td></tr>
 </table>
</form>

the code

var params = $("#tbl2").serialize();

var resp = $.ajax({
    async: false,
    type: "POST",
    url: AppRoot + "webhandlers/postback.ashx",
    data: params
});

Answer 1

First and foremost, a <table> cannot have a name attribute, and even if it could, the jQuery ID selector (#) would not match it.

If you use id instead (<table id="tbl2">), it will work like this:

var params = $("#tbl2 :input").serialize();

The :input selector selects all the form elements (here, inside #tbl2), it is needed because serialize() will only work on those.

Please also check out my jsFiddle Demo.