デフォルトでチェックされているチェックボックスがたくさんあります。私のユーザーはおそらく(もしあれば)いくつかのチェックボックスのチェックを外し、残りはチェックしたままにします。
POSTの形式を - - checkedのチェックボックスではなく not checkedのチェックボックスにする方法はありますか?
チェックボックスの隠し入力を別のIDで追加します。
<input id='testName' type='checkbox' value='Yes' name='testName'>
<input id='testNameHidden' type='hidden' value='No' name='testName'>
フォームを送信する前に、チェックした条件に基づいて非表示の入力を無効にします。
if(document.getElementById("testName").checked) {
document.getElementById('testNameHidden').disabled = true;
}
私がこれまで最も気に入っていた解決策は、チェックされていない可能性があるチェックボックスと同じ名前の隠し入力を入れることです。チェックボックスがチェックされていない場合、隠された入力はまだ成功していてサーバーに送信されますが、チェックボックスがチェックされている場合は隠された入力を上書きします。こうすれば、投稿されたデータのどの値がチェックボックスから来ると予想されるかを追跡する必要がなくなります。
<form>
<input type='hidden' value='0' name='selfdestruct'>
<input type='checkbox' value='1' name='selfdestruct'>
</form>
私はVanilla JavaScriptを使ってそれを解決しました:
<input type="hidden" name="checkboxName" value="0"><input type="checkbox" onclick="this.previousSibling.value=1-this.previousSibling.value">
この2つの入力要素の間にスペースや改行を入れないように注意してください。
this.previousSibling.previousSibling
を使って "上位"要素を取得することができます。
PHPを使用すると、0(設定されていない)または1(設定されている)の名前付き隠しフィールドを確認できます。
私の個人的なお気に入りは、チェックボックスがオフの場合に使用されるのと同じ名前の隠しフィールドを追加することです。しかし、解決策はそれほど簡単ではありません。
このコードを追加すると
<form>
<input type='hidden' value='0' name='selfdestruct'>
<input type='checkbox' value='1' name='selfdestruct'>
</form>
ブラウザは、ここで何をしても構いません。ブラウザは両方のパラメータをサーバに送信し、サーバはそれらをどう処理するかを決定する必要があります。
たとえば、PHPは最後の値を使用するものとして使用します(参照: 重複HTTP GETクエリキーの正式な位置 )。
しかし、私が(Javaをベースにして)一緒に作業した他のシステムはそれを回避します - それらはあなたに最初の価値しか提供しません。 .NETは代わりに両方の要素を持つ配列を代わりに提供します
いつかnode.js、Python、Perlでこれをテストしようと思います。
これを回避する一般的な方法は、各チェックボックスと共に隠し変数を使用することです。
<input type="checkbox" name="mycheckbox" />
<input type="hidden" name="mycheckbox.hidden"/>
サーバー側では、まず隠し変数のリストを検出し、隠し変数ごとに、対応するチェックボックスのエントリがフォームデータで送信されているかどうかを確認します。
サーバー側のアルゴリズムはおそらく次のようになります。
for input in form data such that input.name endswith .hidden
checkboxName = input.name.rstrip('.hidden')
if chceckbName is not in form, user has unchecked this checkbox
上記は厳密には質問に答えませんが、同様の機能を達成するための代替手段を提供します。
コードをコピーするだけで、すべてのチェックボックスに非表示フィールドを作成する必要はありません。チェックされていない場合はチェックボックスの値を変更し、value
は0
を割り当て、チェックボックスがオンの場合はvalue
を1
に割り当てます。
$("form").submit(function () {
var this_master = $(this);
this_master.find('input[type="checkbox"]').each( function () {
var checkbox_this = $(this);
if( checkbox_this.is(":checked") == true ) {
checkbox_this.attr('value','1');
} else {
checkbox_this.prop('checked',true);
//DONT' ITS JUST CHECK THE CHECKBOX TO SUBMIT FORM DATA
checkbox_this.attr('value','0');
}
})
})
フォームの送信イベントでJavascriptを実行できます。それができることのすべてですが、ブラウザに自分でこれを行わせる方法はありません。それはまたあなたのフォームがJavascriptを使わないでユーザのために壊れることを意味します。サーバー上でどのチェックボックスがあるのかを知っておくほうがよいので、投稿されたフォームの値(PHPでは$_POST
)にないものはチェックされていないと推測できます。
$('input[type=checkbox]').on("change",function(){
var target = $(this).parent().find('input[type=hidden]').val();
if(target == 0)
{
target = 1;
}
else
{
target = 0;
}
$(this).parent().find('input[type=hidden]').val(target);
});
<p>
<input type="checkbox" />
<input type="hidden" name="test_checkbox[]" value="0" />
</p>
<p>
<input type="checkbox" />
<input type="hidden" name="test_checkbox[]" value="0" />
</p>
<p>
<input type="checkbox" />
<input type="hidden" name="test_checkbox[]" value="0" />
</p>
チェックボックスの名前を省略してもパスされません。 test_checkbox配列のみです。
私は実際に次のことをするでしょう。
チェックボックスの入力と同じ名前の私の隠し入力フィールドを持っている
<input type="hidden" name="checkbox_name[]" value="0" />
<input type="checkbox" name="checkbox_name[]" value="1" />
それから私が投稿したとき私はまず最初に$ _POST配列で拾った重複した値を削除し、それがそれぞれのユニークな値を表示していると推論します。
$posted = array_unique($_POST['checkbox_name']);
foreach($posted as $value){
print $value;
}
私は投稿からこれを得た 配列から重複した値を削除する
"私はサーバーのアプローチを行ってきました。うまくいったようです - ありがとう。引用したように:javascriptの解決策はサーバハンドラの種類に依存します(私はそれをチェックしませんでした)
といった
if(!isset($_POST["checkbox"]) or empty($_POST["checkbox"])) $_POST["checkbox"]="something";
ここでの答えのほとんどは、JavaScriptの使用または重複した入力コントロールを必要とします。時にはこれは完全にサーバー側で処理する必要があります。
この共通の問題を解決するための(意図された)鍵は、フォームの送信入力制御です。
チェックボックスのチェックされていない値を正しく解釈して処理するには、以下の知識が必要です。
フォームが送信されたかどうかをチェックすることによって(値が送信入力要素に割り当てられる)、チェックされていないチェックボックス値はすべてと見なすことができます。
例えば:
<form name="form" method="post">
<input name="value1" type="checkbox" value="1">Checkbox One<br/>
<input name="value2" type="checkbox" value="1" checked="checked">Checkbox Two<br/>
<input name="value3" type="checkbox" value="1">Checkbox Three<br/>
<input name="submit" type="submit" value="Submit">
</form>
PHPを使用している場合、どのチェックボックスがチェックされているかを検出するのはかなり簡単です。
<?php
$checkboxNames = array('value1', 'value2', 'value3');
// Persisted (previous) checkbox state may be loaded
// from storage, such as the user's session or a database.
$checkboxesThatAreChecked = array();
// Only process if the form was actually submitted.
// This provides an opportunity to update the user's
// session data, or to persist the new state of the data.
if (!empty($_POST['submit'])) {
foreach ($checkboxNames as $checkboxName) {
if (!empty($_POST[$checkboxName])) {
$checkboxesThatAreChecked[] = $checkboxName;
}
}
// The new state of the checkboxes can be persisted
// in session or database by inspecting the values
// in $checkboxesThatAreChecked.
print_r($checkboxesThatAreChecked);
}
?>
初期データは各ページロードでロードできますが、フォームが送信された場合にのみ変更する必要があります。チェックボックスの名前は事前にわかっているので、それらを個別に調べて調べることができます。したがって、個々の値が存在しないことは、チェックされていないことを示します。
私は最初にSamのバージョンを試しました。良い考えですが、それは同じ名前を持つフォームに複数の要素があることを引き起こします。名前に基づいて要素を検索するJavaScriptを使用すると、要素の配列が返されるようになります。
私はPHPでShaileshの考えを完成させました、それは私のために働きます。これが私のコードです:
/*オリジナルが存在する場合は '.hidden'フィールドを削除し、存在しない場合は '.hidden'値を使用します。 */ foreach($ field_name => $ valueとしての$ _POST ['frmmain']) { // '.hidden'で終わる要素のみを見る (!substr($ field_name、-strlen( '。hidden'))){ break; } //なしで名前を取得'.hidden' $ real_name = substr($ key、strlen($ field_name) - strlen( '。hidden')); //偽のオリジナルを作成するオリジナルが存在しない場合は '.hidden'の値を持つフィールド if(!array_key_exists($ real_name、$ POST_copy)){ $ _POST [$ real_name] = $ value; [。 // '.hidden'要素を削除します 設定解除($ _ POST [$ field_name]); }
このjQueryブロックを使用します。これにより、送信時に非表示の入力がチェックされていないすべてのチェックボックスに追加されます。マークアップを乱雑にしたり、後で追加したチェックボックスで忘れずに、チェックボックスごとに常に値が送信されることを保証します。あなたが使用しているバックエンドスタック(PHP、Rubyなど)には関係ありません。
// Add an event listener on #form's submit action...
$("#form").submit(
function() {
// For each unchecked checkbox on the form...
$(this).find($("input:checkbox:not(:checked)")).each(
// Create a hidden field with the same name as the checkbox and a value of 0
// You could just as easily use "off", "false", or whatever you want to get
// when the checkbox is empty.
function(index) {
var input = $('<input />');
input.attr('type', 'hidden');
input.attr('name', $(this).attr("name")); // Same name as the checkbox
input.attr('value', "0"); // or 'off', 'false', 'no', whatever
// append it to the form the checkbox is in just as it's being submitted
var form = $(this)[0].form;
$(form).append(input);
} // end function inside each()
); // end each() argument list
return true; // Don't abort the form submit
} // end function inside submit()
); // end submit() argument list
私はあなたが追加の入力フィールドを投稿するだけの解決策も気に入っています。JavaScriptを使用することは私にとってはちょっとハックなようです。
あなたの用途に応じて、バックエンドはどちらの入力が最初になるかに依存します。
最初のオカレンスが使用されるサーバーバックエンド(JSP)では、以下を実行する必要があります。
<input type="checkbox" value="1" name="checkbox_1"/>
<input type="hidden" value="0" name="checkbox_1"/>
最後に出現したものが使用されるサーバーバックエンド(PHP、Rails)の場合、以下のことをすべきです。
<input type="hidden" value="0" name="checkbox_1"/>
<input type="checkbox" value="1" name="checkbox_1"/>
すべての発生がリストデータ型([]
、array
)に格納されているサーバーバックエンドの場合。 (Python/Zope)
あなたは好きな順序で投稿することができます、あなたはcheckbox
type属性を持つ入力から値を取得しようとする必要があります。チェックボックスが非表示要素の前にある場合はリストの最初のインデックス、チェックボックスが非表示要素の後にある場合は最後のインデックスです。
すべての出現箇所がコンマと連結されているサーバーバックエンドの場合(ASP.NET/IIS)リストデータ型を作成するには、区切り文字としてコンマを使用して文字列を(分割/展開)する必要があります。 ([]
)
チェックボックスが非表示要素の前にある場合はリストの最初のインデックスを取得し、チェックボックスが非表示要素の後にある場合は最後のインデックスを取得することができます。
Form.submitイベントをインターセプトして送信前にリバースチェックすることもできます。
$('form').submit(function(event){
$('input[type=checkbox]').prop('checked', function(index, value){
return !value;
});
});
$('form').submit(function () {
$(this).find('input[type="checkbox"]').each( function () {
var checkbox = $(this);
if( checkbox.is(':checked')) {
checkbox.attr('value','1');
} else {
checkbox.after().append(checkbox.clone().attr({type:'hidden', value:0}));
checkbox.prop('disabled', true);
}
})
});
私はこの質問が古く、多くの答えを持っているのを見ますが、とにかくペニーを差し上げます。一部の人が指摘しているように、私の投票はフォームの 'submit'イベントに対するJavaScriptソリューションに対するものです。入力を2倍にすることなく(特に、htmlとphpコードを組み合わせた長い名前と属性がある場合)、サーバー側で面倒なこと(すべてのフィールド名を知っていてそれらを1つずつチェックする必要がある)はありません。それらに0の値(または '未チェック'ステータスを示すために必要なもの)を割り当ててから、それらの属性 'checked'をtrueに変更します。
$('form').submit(function(e){
var b = $("input:checkbox:not(:checked)");
$(b).each(function () {
$(this).val(0); //Set whatever value you need for 'not checked'
$(this).attr("checked", true);
});
return true;
});
こうすれば、次のような$ _POST配列ができます。
Array
(
[field1] => 1
[field2] => 0
)
私はこの質問が3歳であることを知っていますが、私はかなりうまくいくと思う解決策を見つけました。
$ _POST変数が割り当てられているかどうかを確認し、それを変数に保存することができます。
$value = isset($_POST['checkboxname'] ? 'YES' : 'NO';
isset()関数は$ _POST変数が割り当てられているかどうかをチェックします。論理的に割り当てられていない場合、チェックボックスはチェックされません。
$ _POSTを照合したい
if (!$_POST['checkboxname']) !$_POST['checkboxname'] = 0;
POSTに 'checkboxname'値がない場合は、チェックされていないので、値を割り当てます。
ckeckboxの値の配列を作成し、値が存在するかどうかをチェックする関数を作成できます。存在しない場合は、チェックを外して値を割り当てることができます。
私がしたことは少し違いました。まず、チェックされていないチェックボックスすべての値を変更しました。 「0」にすると、それらすべてが選択され、値が送信されます。
function checkboxvalues(){
$("#checkbox-container input:checkbox").each(function({
if($(this).prop("checked")!=true){
$(this).val("0");
$(this).prop("checked", true);
}
});
}
チェックボックスは通常、Yes/No、Y/Nまたは1/0の値としてデータベースに格納されているバイナリデータを表します。 HTMLのチェックボックスは、チェックボックスがチェックされている場合にのみサーバーに値を送信するという悪い性質を持っています。つまり、他のサイトのサーバースクリプトは、正(チェックあり)または負(チェックなし)の値を格納できるようにするために、Webページで可能なすべてのチェックボックスを事前に知っておく必要があります。実際には、負の値のみが問題になります(ユーザーが以前に(事前に)チェックされた値をオフにした場合 - この名前を送信する必要があることが事前にわからない場合UPDATEスクリプトを動的に作成するサーバーサイドスクリプトがある場合、チェック済みのY値とチェックなし(未受信)のN値を設定するためにすべてのチェックボックスを受け取る必要があるかわからないため、問題があります。
私は自分のデータベースに値 'Y'と 'N'を格納し、チェックされたチェックボックスとチェックされていないチェックボックスを介してそれらを表すので、それぞれの値に隠しフィールドを追加しました。そして、選択に従ってifの値を設定するために簡単なJavaScript関数check()を使用します。
<input type="hidden" id="N1" name="N1" value="Y" />
<input type="checkbox"<?php if($N1==='Y') echo ' checked="checked"'; ?> onclick="check(this);" />
<label for="N1">Checkbox #1</label>
1つのJavaScript onclickリスナーを使用して、私のWebページの各チェックボックスに対して関数check()を呼び出します。
function check(me)
{
if(me.checked)
{
me.previousSibling.previousSibling.value='Y';
}
else
{
me.previousSibling.previousSibling.value='N';
}
}
このようにして、 'Y'または 'N'の値は常にサーバーサイドスクリプトに送信されます。更新する必要があるフィールドは何かを知っています。 '。
注:空白または改行も兄弟ですので、ここでは.previousSibling.previousSibling.valueが必要です。間にスペースがない場合は、.previousSibling.valueのみ
前のように明示的にonclickリスナを追加する必要はありません。jQueryライブラリを使用して、ページ内のすべてのチェックボックスの値を変更する機能を持つクリックリスナを動的に追加できます。
$('input[type=checkbox]').click(function()
{
if(this.checked)
{
$(this).prev().val('Y');
}
else
{
$(this).prev().val('N');
}
});
Ajaxアクションの例は、( ':checked').val()の代わりにjQueryを使用することです。
var params = {
books: $('input#users').is(':checked'),
news : $('input#news').is(':checked'),
magazine : $('input#magazine').is(':checked')
};
paramsはTRUE OR FALSEの値を取得します。
チェックボックスの問題は、チェックボックスがチェックされていないとフォームに投稿されないことです。チェックボックスをチェックしてフォームを投稿すると、フォームの処理に使用できる$ _POST変数にチェックボックスの値が入ります。チェックされていない場合、$ _POST変数に値は追加されません。
PHPでは、通常、チェックボックス要素のisset()チェックを行うことでこの問題を回避します。あなたが期待している要素が$ _POST変数に設定されていない場合、チェックボックスがチェックされず、値がfalseになる可能性があることがわかります。
if(!isset($_POST['checkbox1']))
{
$checkboxValue = false;
} else {
$checkboxValue = $_POST['checkbox1'];
}
しかし、動的フォームを作成した場合、チェックボックスの名前属性が必ずしもわからない場合があります。チェックボックスの名前がわからない場合は、isset関数を使用してこれが送信されたかどうかを確認することはできません。 $ _POST変数.
より良い回避策があります。まず最初に、チェックされているチェックボックスだけにname属性を与えます。それからsubmit
をクリックすると、JavaScriptのfunction
を通して、あなたはすべてのチェックされていないボックスをチェックします。そのため、あなたがsubmit
を指定した場合、name
プロパティを持っている人だけがform collection
で取得されます。
//removing name attribute from all checked checkboxes
var a = $('input:checkbox:checked');
$(a).each(function () {
$(this).removeAttr("name");
});
// checking all unchecked checkboxes
var b = $("input:checkbox:not(:checked)");
$(b).each(function () {
$(this).attr("checked", true);
});
利点:余分な隠しボックスを作成し、それらを操作する必要はありません。
すべての答えは素晴らしいですが、同じ名前のフォームに複数のチェックボックスがあり、それぞれのチェックボックスのステータスを投稿したい場合。それから私はチェックボックス(私が欲しいものに関連した名前)で隠しフィールドを置くことによってこの問題を解決しました。
<input type="hidden" class="checkbox_handler" name="is_admin[]" value="0" />
<input type="checkbox" name="is_admin_ck[]" value="1" />
次に、以下のjqueryコードによってチェックボックスの変更ステータスを制御します。
$(documen).on("change", "input[type='checkbox']", function() {
var checkbox_val = ( this.checked ) ? 1 : 0;
$(this).siblings('input.checkbox_handler').val(checkbox_val);
});
チェックボックスを変更すると、関連する隠しフィールドの値が変わります。そしてサーバー上では、チェックボックスではなく非表示のフィールドのみを見ることができます。
誰かがこの種の問題を抱えているのを助けることを願っています。応援:)
この解決策は@ deswのものに触発されています。
入力名が「フォームスタイル」の場合は、1つのチェックボックスがチェックされるとすぐにチェックボックス値との配列インデックスの関連付けが失われ、チェックボックスがチェックされるたびにこの「分離」が1単位ずつ増加します。これは、いくつかのフィールドで構成された従業員のようなものを挿入するためのフォームの場合です。例えば、
<input type="text" name="employee[]" />
<input type="hidden" name="isSingle[] value="no" />
<input type="checkbox" name="isSingle[] value="yes" />
一度に3人の従業員を挿入し、1人目と2人目がシングルの場合、5要素のisSingle
配列になります。そのため、3つの配列を同時に反復することはできません。たとえば、データベースに従業員を挿入します。
あなたはいくつかの簡単な配列後処理でこれを克服することができます。サーバー側でPHPを使用していますが、これを行いました。
$j = 0;
$areSingles = $_POST['isSingle'];
foreach($areSingles as $isSingle){
if($isSingle=='yes'){
unset($areSingles[$j-1]);
}
$j++;
}
$areSingles = array_values($areSingles);
そのため、この問題を解決するにはやり過ぎですが、テーブル内のさまざまな行に同じチェックボックスが何度も表示されていたときには役に立ちました。チェックボックスが表す行とチェックボックスの状態(チェックあり/チェックなし)を知る必要がありました。
私のしたことは、チェックボックス入力からname属性を削除し、それらすべてに同じクラスを指定して、データに相当するJSONを保持する隠し入力を作成することでした。
HTML
<table id="permissions-table">
<tr>
<td>
<input type="checkbox" class="has-permission-cb" value="Jim">
<input type="checkbox" class="has-permission-cb" value="Bob">
<input type="checkbox" class="has-permission-cb" value="Suzy">
</td>
</tr>
</table>
<input type="hidden" id="has-permissions-values" name="has-permissions-values" value="">
フォーム送信時に実行するJavaScript
var perms = {};
$(".has-permission-checkbox").each(function(){
var userName = this.value;
var val = ($(this).prop("checked")) ? 1 : 0
perms[userName] = {"hasPermission" : val};
});
$("#has-permissions-values").val(JSON.stringify(perms));
Jsonの文字列は$ _POST ["has-permissions-values"]の形式で渡されます。 PHPでは、文字列を配列にデコードすると、各行と対応する各チェックボックスのtrue/false値を持つ連想配列ができます。それから、歩いて、現在のデータベース値と比較することは非常に簡単です。
私はjavascriptを必要としない解決策を継続することを好みます(そして、はい、私は今ludditeとして分類するものがあることを知っています)が、あなたが私のようであり、あなたがチェックボックスをオンにして、送信されたフォームに基づいてそれを保持するか更新します。これを試してください(上記のいくつかのアイデアに基づいています)。
初期チェックボックスの状態を決定する変数を設定し、フォームを送信するたびにサーバーチェックを使用して表示を決定します。
以下の例では、(WordPressで使用するために他の場所でも同様に機能する)配列の配列を作成してから、隠しフィールドやJavaScriptを使用せずにサーバースクリプトを使用してチェックボックスの状態を決定します。
<?php
$options_array = array (
array('list_companies_shortcode' , 'shortcode_list_companies' , 'List Companies Shortcode'),
array('list_contacts_shortcode' , 'shortcode_list_contacts' , 'List Contacts Shortcode'),
array('test_checkbox_1' , 'checked' , 'Label for Checkbox 1' , 'checkbox' , 'Some text to instruct the user on this checkbox use' ),
array('test_checkbox_2' , '' , 'Label for Checkbox 2' , 'checkbox' , 'Some other text to instruct the user on this checkbox use' )
) ;
$name_value_array = array() ;
$name_label_array = array() ;
$field_type_array = array() ;
$field_descriptor_array = array() ;
foreach ( $options_array as $option_entry ) {
$name_value_array[ $option_entry[0] ] = $option_entry[1] ;
$name_label_array[ $option_entry[0] ] = $option_entry[2] ;
if ( isset( $option_entry[3] ) ) {
$field_type_array[ $option_entry[0] ] = $option_entry[3] ;
$field_descriptor_array[ $option_entry[0] ] = $option_entry[4] ;
} else {
$field_type_array[ option_entry[0] ] = 'text' ;
$field_descriptor_array[ $option_entry[0] ] = NULL ;
}
}
echo "<form action='' method='POST'>" ;
foreach ( $name_value_array as $setting_name => $setting_value ) {
if ( isset( $_POST[ 'submit' ] ) ) {
if ( isset( $_POST[ $setting_name ] ) ) {
$setting_value = $_POST[ $setting_name ] ;
} else {
$setting_value = '' ;
}
}
$setting_label = $option_name_label_array[ $setting_name ] ;
$setting_field_type = $field_type_array[ $setting_name ] ;
$setting_field_descriptor = $field_descriptor_array [ $setting_name ] ;
echo "<label for=$setting_name >$setting_label</label>" ;
switch ( $setting_field_type ) {
case 'checkbox':
echo "<input type='checkbox' id=" . $setting_name . " name=" . $setting_name . " value='checked' " . $setting_value . " >(" . $setting_field_descriptor . ")</input><br />" ;
break ;
default:
echo "<input type='text' id=" . $setting_name . " name=" . $setting_name . " value=" . $setting_value . " ></input><br />" ;
}
}
echo "<input type='submit' value='Submit' name='submit' >" ;
echo "</form>" ;
チェックされていないチェックボックスは送信されないため、これはJavaScriptによってのみ達成できます。だからあなたはJavaScriptが必要です。舞台裏でチェックボックスをオフにすると隠しフィールドが追加されます。 JavaScriptがなければこれはできませんでした。
jQueryの@ vishnuの答え。
if($('#testName').is(":checked")){
$('#testNameHidden').prop('disabled', true);
}
jQuery 1.5以下を使用している場合は、.prop()の代わりに.attr()関数を使用してください
<input type="checkbox" id="checkbox" name="field_name" value="1">
隠しフィールドを使用せずに、サーバー側でトリックを実行できます。
三項演算子を使用する:
isset($_POST['field_name']) ? $entity->attribute = $_POST['field_name'] : $entity->attribute = 0;
通常のIF演算子を使う:
if (isset($_POST['field_name'])) {
$entity->attribute = $_POST['field_name'];
} else {
$entity->attribute = 0;
}
function SubmitCheckBox(obj) {
obj.value = obj.checked ? "on" : "off";
obj.checked = true;
return obj.form.submit();
}
<input type=checkbox name="foo" onChange="return SubmitCheckBox(this);">
フォームを送信する前に隠し要素を追加できます。
$('form').submit(function() {
$(this).find('input[type=checkbox]').each(function (i, el) {
if(!el.checked) {
var hidden_el = $(el).clone();
hidden_el[0].checked = true;
hidden_el[0].value = '0';
hidden_el[0].type = 'hidden'
hidden_el.insertAfter($(el));
}
})
});
@cpburnzはそれを正しく行いましたが、多くのコードに対して、これはより少ないコードを使用した同じ考えです:
JS:
// jQuery OnLoad
$(function(){
// Listen to input type checkbox on change event
$("input[type=checkbox]").change(function(){
$(this).parent().find('input[type=hidden]').val((this.checked)?1:0);
});
});
HTML(配列名を使ってフィールド名をメモします):
<div>
<input type="checkbox" checked="checked">
<input type="hidden" name="field_name[34]" value="1"/>
</div>
<div>
<input type="checkbox">
<input type="hidden" name="field_name[35]" value="0"/>
</div>
<div>
そしてPHPの場合:
<div>
<input type="checkbox"<?=($boolean)?' checked="checked"':''?>>
<input type="hidden" name="field_name[<?=$item_id?>]" value="<?=($boolean)?1:0?>"/>
</div>
ばかげて見えるかもしれませんが、それは私のために働きます。主な欠点は、視覚的にはチェックボックスではなくラジオボタンですが、JavaScriptなしで機能することです。
HTML
Initialy checked
<span><!-- set the check attribute for the one that represents the initial value-->
<input type="radio" name="a" value="1" checked>
<input type="radio" name="a" value="0">
</span>
<br/>
Initialy unchecked
<span><!-- set the check attribute for the one that represents the initial value-->
<input type="radio" name="b" value="1">
<input type="radio" name="b" value="0" checked>
</span>
とCSS
span input
{position: absolute; opacity: 0.99}
span input:checked
{z-index: -10;}
span input[value="0"]
{opacity: 0;}
私はあなたがこのコードで見つけた問題を聞きたいのですが、私は本番でそれを使用します
チェックボックスの値の配列(チェックされていない項目を含む)を送信する場合は、次のようにします。
<form>
<input type="hidden" value="0" name="your_checkbox_array[]"><input type="checkbox">Dog
<input type="hidden" value="0" name="your_checkbox_array[]"><input type="checkbox">Cat
</form>
$('form').submit(function(){
$('input[type="checkbox"]:checked').prev().val(1);
});
送信時にチェックボックスがオフになっている場合は、チェックボックスの値を 'NO'に更新し、checked = 'TRUE'に設定します。
https://jsfiddle.net/pommyk/8d9jLrvo/26/
$(document).ready(function()
{
function save()
{
if (document.getElementById('AgeVerification').checked == false)
{
document.getElementById('AgeVerification').value = 'no';
document.getElementById('AgeVerification').checked = true;
}
}
document.getElementById("submit").onclick = save;
})