jQueryに関しては初心者ですが、別のstackoverflowメンバーのおかげで、ユーザーがラジオボタンをクリックして、クリックしたラジオボタンリンクのテキストで満たされたテーブル行を追加できるようにするコードがあります。jQueryコードは次のとおりです。
$('.addRow').click(function() {
var tr = $(
'<tr><td class="cat"></td>'
+ '<td class="sel"></td>'
+ '<td><textarea name="cmo-paragraph[' + count + ']">Click to edit (id '
+ count
+ ')</textarea></td></tr>'
);
$('.mainTable > tbody:last').one().append(tr);
tr.find(".cat").text($(this).closest("li.category").attr("title"));
tr.find(".sel").text($(this).closest("li.select").attr("title"));
count++;
});
ラジオリストのスニペットは次のとおりです。
<li class="category" value="1" title="Chronic Pain Referral">Chronic Pain Referral
<ul>
<li class="select" title="Chronic referral">
<input type="radio" class="addRow" id="radio1" name="modalities" value="1">
<label for="radio1">Chronic referral</label>
</li>
</ul>
</li>
これにより、フロントエンドでそれぞれ「慢性疼痛の紹介」と「慢性の紹介」で満たされた「カテゴリ」と「選択」テーブルのセルを使用して、毎回テーブルに行が正常に追加されます。
問題は、この情報をフォームに送信してデータベースに保存できるようにしたいということです。「カウント」変数のおかげで行を反復処理できるため、テキストエリア データを取得できますが、各行の「カテゴリ」セルと「選択」セルの値は現在渡されません。
次のコード変更を試みましたが、うまくいかないようです:
$('.addRow').click(function() {
var tr = $(
'<tr><td class="cat"><input type="hidden" class="hiddenCat" name="category[' + count + ']"></td>'
+ '<td class="sel"></td>'
+ '<td><textarea name="paragraph[' + count + ']">Click to edit (id ' + count + ')</textarea></td></tr>'
);
$('.mainTable > tbody:last').one().append(tr);
tr.find(".cat").text($(this).closest("li.category").attr("title"));
tr.find(".hiddenCat").text($(this).closest("li.category").attr("value"));
tr.find(".sel").text($(this).closest("li.select").attr("title"));
count++;
});