/ / Javascript-テキストボックスにチェックボックス値を入力する-javascript、jquery、html

Javascript - テキストボックスにチェックボックスの値を入力する - javascript、jquery、html

私のWebアプリケーションでは、チェックボックスの上にテキストボックスを設定するチェックボックスを設定しました(複数のチェックボックスが選択されている場合、それらの値はコンマで区切られてテキストボックスに表示されます)。

これらのチェックボックスのセットは、HTMLテーブルの行として表示されます。

これが私のHTMLコードです。

<input type="text" id="newContactComment<%=rCount %>" name="newContactComment" size="45">

<input type="checkbox" id="commentText<%=rCount %>" name="commentText" value="<%=c.getComment_text() %>"
onclick="javascript:updateTextArea(<%=rCount%>);">

また、対応するJS関数は次のとおりです。

function updateTextArea(rCount) {
var allVals = new Array();
$("#contactInfo input["commentText" + rCount]:checked").each(function() {
(allVals).push($(this).val());
});

$("#newContactComment" + rCount).val(allVals);
}

rCount 上記の関数の変数は、テーブルの行番号です。 上記を使用すると、期待どおりの動作が得られません。
例えば テーブルの行1について、chkbox 1および2をチェックすると、それらのチェックボックスの値が正しく入力されます。今、私のテーブルのうち2つについて、chkbox 3のみをチェックします。期待どおり3だけでなく、値1、2、3が入力されています。

どんな助けでも大歓迎です。

回答:

回答№1は0

インラインで設定するよりも、jQueryを使用してイベントハンドラーを設定する方が適切です。

onclickイベントではなく、onchangeイベントを使用します。

チェックボックスのクラス名(または必要なもの)をチェックボックスに追加すると、次のように機能します。

$("input.checkboxes").change(function(){ //when checkbox is ticked or unticked


var par = $(this).closest("tr")[0];
var parID = par.id;
var patt1=/([0-9]+)$/g;
var rCount = parID.match(patt1); //Gets number off end of id

var allVals = new Array();

//Get all checkboxes in current row that are checked
$(par).find("td input.checkboxes:checked").each(function() {
allVals.push($(this).val());
});

$("#newContactComment" + rCount).val(allVals);

allVals = null; //empty array as not needed

});

私はこれまたはこれらの線に沿った何かがあなたが望むことをすると信じています


回答№2の場合は0

あなた」を使用しようとしています rCount 引用符で囲まれた文字列内の変数。代わりにこれを試してください:

$("#contactInfo input["commentText" + rCount + ""]:checked")