form内のリストで複数件をPOSTする方法

Question

すみませんタイトルだとわかりづらいかと思いますが、
やりたい内容としては

form内で

---

<table id='table'> <tbody> <tr><td><input type='hidden'name='td0.hoge'></td> <td><input type='hidden'name='td0.hoge2'></td></tr> <tr><td><input type='hidden'name='td1.hoge'></td> <td><input type='hidden'name='td1.hoge2'></td></tr> </tbody> </table>

---

このtrの中の要素を
jqueryでリストにまとめてajaxでpostしたいのですが、

---

var list = [];

$('#table tr').each(function(i){
var a = {
'hoge' : $(this).find('input[name = td'+i+'.hoge]').val(),
'hoge2' : $(this).find('input[name = td'+i+'.hoge2]').val()
}
list.push(a);
});

---

みたいな形で作ってみたのですが、エラーになります。
ためしにfor文で下記のように作ってみたのですが、
エラーにはならないのですが、値がちゃんと入っておりません。

---

for(var i = 0;i<$('#table tr').length;i++){
var a = {
'hoge' : $(this).find('input[name = td'+i+'.hoge]').val(),
'hoge2' : $(this).find('input[name = td'+i+'.hoge2]').val()
}
list.push(a);
}

---

すみませんが何故上手くいかないのか
ご教授お願いいたします。

Answer 1

ためしにfor文で下記のように作ってみたのですが、

エラーにはならないのですが、値がちゃんと入っておりません。

tdの内容はval()ではなく、text()で取得します。

こちらは単純にセミコロン忘れな気がします…

var list = [];
$('#table tr').each(function(i){ 
  var a = { 
    'hoge' : $(this).find('[name = td'+i+'.hoge').val(), 
    'hoge2' : $(this).find('[name = td'+i+'.hoge2').val() 
  };
  list.push(a); 
});

ちなみにこの書き方ですと、iの値が必ず対になっていると保証されないので少々危険な書き方だと思います。
以下のような書き方がよいと思います。

<table id='table'> 
<tbody>
  <tr>
    <td><input type='hidden' name='td0.hoge'  class="hoge"></td>
    <td><input type='hidden' name='td0.hoge2' class="hoge2"></td>
  </tr> 
  <tr>
    <td><input type='hidden' name='td1.hoge'  class="hoge"></td>
    <td><input type='hidden' name='td1.hoge2' class="hoge2"></td>
  </tr> 
</tbody> 
</table>

var list = [];
$('#table tr').each(function(i){ 
  var a = { 
    'hoge' : $(this).find('input:hidden.hoge').val(), 
    'hoge2' : $(this).find('input:hidden.hoge2').val() 
  };
  list.push(a); 
});

Comments

[退会済みユーザー]

すみませんすみません、
tdのモノではなくinputのものでした。。。
ご回答いただいたのに申し訳ございません。

[nayuneko]

なるほど。考え方自体は同じですので、「ちなみに～」以下を修正しましたので、ご確認くださいませ。

[退会済みユーザー]

ありがとうございます！
上手くいきました！

Answer 2

findに設定しているセレクタの文字列に']'がないというのと、.val()はinput系のエレメントにしか使えません。ですので.text()を使用します。

var list = [];

$('#table tr').each(function(i){ 
	var a = { 
		'hoge' : $(this).find('[name="td'+i+'.hoge"]').text(), 
		'hoge2' : $(this).find('[name="td'+i+'.hoge2"]').text() 
	} 
	list.push(a); 
});

Comments

[退会済みユーザー]

すみませんいろいろと質問内容が間違ってました修正します。
要素はinput要素のモノで、[]に関しても入っておりました。。。

Answer 3

1 番目のものは i が定義されていません。2 番目のものは val でなく text ではありませんか？

訂正

i は私の見落としでした。

Comments

[退会済みユーザー]

本当にすみません、
tdではなくinput内のものです。。。
ご回答頂いたのに申し訳ございません。