電話番号が繰り返されないと仮定すると、最も簡単な方法は、各チェックボックスの値を関連する電話番号に設定することです。
0262543210 <input type="checkbox" name="makeVisible" value="0262543210">
0265511223 <input type="checkbox" name="makeVisible" value="0265511223">
0398123456 <input type="checkbox" name="makeVisible" value="0398123456">
(明らかに、ある種のフォーマット、表、または順序付けられていないリストなどを追加します。)
次に、サーバー側のコードmakeVisible
で、チェックされたものだけが送信されることを念頭に置いて、各(または名前を付けた)値を処理します。このメソッドにはJavaScriptは必要ありません。
すべての数値に対してyes/noまたはtrue/false(表示/非表示)の値を送信する場合、no-JSの方法はラジオボタンを使用することです。ただし、チェックボックスを使用する最も簡単な方法は、チェックボックスの状態に基づいて非表示のフィールドを設定することです。
<table>
<tr>
<th>Phone Number</th>
<th>Make visible?</th>
</tr>
<tr>
<td>0262543210</tr>
<td>
<input type="hidden" name="number" value="0262543210">
<input type="hidden" name="makeVisible">
<input type="checkbox" class="numbervisibility">
</td>
</tr>
<tr>
<td>0265511223</tr>
<td>
<input type="hidden" name="number" value="0265511223">
<input type="hidden" name="makeVisible">
<input type="checkbox" class="numbervisibility">
</td>
</tr>
<!-- etc. -->
</table>
必要に応じて、レコードIDを使用して非表示フィールドを追加するか、電話番号の代わりにレコードIDを使用します(データ構造に適したものは何でも)。
次に、いくつかの単純なjQueryを使用して、チェックボックスが変更されたときに非表示の値を設定します。
$(".numbervisibility").click(function() {
$(this).closest("td").find('input[name="makeVisible"]').val(this.checked ? "Y" : "N");
});
そうすれば、サーバー側では、フィールドの配列が番号と関連する可視性設定と一致することになります。
PHPを使用している場合は、繰り返しフィールドに。[]
のように末尾に名前を付ける必要があることに注意してください"makeVisible[]"
。
(もちろん、どちらのソリューションでも、サーバー側のコードを使用して電話番号をhtmlに挿入します。)