JQueryを使用してフォームを送信しています。フォームは以下のようになります
<form class="ask-more-form">
<div class="product_info_2">
<textarea name="product_question" class="textbox" placeholder="Ask You Question Here"></textarea>
</div>
<input type="hidden" name="product_id" value="1" id="product_id">
<a href="#" class="whiteButton submit" id="ask-more-submit-button">Ask Question</a>
</form>
そして、フォームをキャッチするJQueryは次のようになります。
$('#ask-more').on('submit', '.ask-more-form', function() {
var product_id = $(this).children('input[name=product_id]').val();
var product_question = $(this).children('textarea[name="product_question"]').text();
alert(product_question);
//submitQuestion(product_id, product_question);
});
Product_idは常に読み取られますが、製品の質問は常にnullです。なぜこれが起こっているのか誰かに教えてもらえますか?
.children
1レベル下のみ 。使用する .find
代わりに:
$('#ask-more').on('submit', '.ask-more-form', function () {
var product_id = $(this).children('input[name=product_id]').val();
var product_question = $(this).find('textarea[name="product_question"]').text();
alert(product_question);
//submitQuestion(product_id, product_question);
});
text()
を使用する必要があるときに、_<textarea>
_でval()
を使用している
_var product_question = $(this).children('textarea[name="product_question"]').val();
_
これは、_<select>
_や_<input>
_などの他の入力要素タイプにも当てはまります。
Use .val() instead of .text()
。それはトリックを行います
children
またはfind
を使用する必要はありません。フォームのid
がすでにあるので、それをベースに使用して、次のように標準のjqueryセレクターを使用できます。
var product_question = $('textarea[name="product_question"]', this).val();
seocnd引数を追加することにより、jqueryにthis
のみをDOMツリーとして使用するように指示します。