複数のフィールドの可視性を切り替えるフォームがあるとします。また、フィールドが表示されていない場合、その値を要求したくありません。
この状況にどのように対処しますか?
フォーム要素を無効に設定すると、サーバーへの移動が停止します。例:
<input disabled="disabled" type="text" name="test"/>
Javascriptでは、次のようなものを意味します。
var inputs = document.getElementsByTagName('input');
for(var i = 0;i < inputs.length; i++) {
if(inputs[i].style.display == 'none') {
inputs[i].disabled = true;
}
}
document.forms[0].submit();
JQueryの場合:
$('form > input:hidden').attr("disabled",true);
$('form').submit();
Javascriptを使用して、無効な属性を設定できます。 「送信」ボタンのクリックイベントは、おそらくこれを行うのに最適な場所です。
ただし、これを行うことはまったくお勧めしません。可能であれば、サーバーでクエリをフィルタリングする必要があります。これはより信頼できるでしょう。
すべての要素または非表示の親要素内の特定の要素を無効にする場合は、次を使用できます。
$("div").filter(":hidden").children("input[type='text']").attr("disabled", "disabled");
この例 http://jsfiddle.net/gKsTS/ は非表示のdiv内のすべてのテキストボックスを無効にします
どうですか:
$('#divID').children(":input").prop("disabled", true); // disable
そして
$('#divID').children(":input").prop("disabled", false); // enable
非表示のdiv内のすべての子入力(選択、チェックボックス、入力、テキストエリアなど)を切り替えます。
1つの非常に単純な(常に最も便利なわけではない)ソリューションは、「名前」属性を削除することです。標準では、ブラウザーは名前のない値を送信しないことを要求します。
入力から値を削除するか、入力オブジェクトをDOMから切り離して、そもそも存在しないようにします。