0

チェックボックスがたくさんある非常に長いフォームを送信する必要があります。これらは、次のように領域ごとにグループ化されています。

<fieldset>
    <legend>Whatever1</legend>
    <div class="checkbox-list">
        <label class="checkbox inline"><input type="checkbox" name="Hobbies" value="Arts"> Arts</label>
        <label class="checkbox inline"><input type="checkbox" name="Hobbies" value="Bars"> Bars</label>
        <label class="checkbox inline"><input type="checkbox" name="Hobbies" value="Books"> Books</label>
        (more items)
    </div>
</fieldset>
<fieldset>
    <legend>Whatever2</legend>
    <div class="checkbox-list">
        <label class="checkbox inline"><input type="checkbox" name="Interests" value="Architecture"> Architecture</label>
        <label class="checkbox inline"><input type="checkbox" name="Interests" value="Audio"> Audio/vídeo</label>
        <label class="checkbox inline"><input type="checkbox" name="Interests" value="Business"> Business</label>
        (more items)            
    </div>
</fieldset>

フォームははるかに長いですが、あなたはアイデアを得ることができます。

name="Hobbies" value="Arts"djangoバックエンドを使用すると、Hobbies配列にグループ化されたすべてのチェックボックスが受信されます。これは非常に便利ですが、チェックされていないチェックボックスも知っておく必要があります。非表示の入力トリックについては知っていvalueますが、チェックボックスのグループ化の一部としてフィールドを使用しているため、役に立ちません。

私に何ができるかについて何か考えはありますか？

4

4 に答える 4

3

さて、あなたがすでに知っていると思いますが、基本的に、どのボックスがチェックされていないかをブラウザに尋ねる方法はありません。HTMLフォームの発明者を非難する...

グループ化ロジックを壊さないいくつかの簡単なアプローチを次に示します。

  • サーバー側に表示したチェックボックスのリストを再生成します。とにかく、これは多くの場合に望ましいことです。これは、戻ってくるデータが表示したものとまったく同じであると信頼していないことを意味するためです。（Firebugなどのデバッグツールを使用してチェックボックスの1つを削除したり、新しいチェックボックスを追加したりするとどうなるか考えてみてください...）
  • 各チェックボックスに対応する名前（「Interests_All」、「Hobbies_All」など）を持つ非表示の入力を含めて、2つのデータ配列を作成します。1つはチェックされた項目のみを含み、もう1つは表示されたすべてを含みます。
  • チェックボックスの代わりにラジオボタンを使用します。はい、表示方法は異なりますが、配列に追加するかどうかだけでなく、はい/いいえの値を送信するために必要な機能を使用できます。
于 2013-02-18T20:25:56.747 に答える
0

非表示の入力フィールドを追加し、フォームの送信時にjQueryを使用して、非表示の入力の値に、チェックされていないチェックボックスの値を含む配列を入力できます。

$("form").on("submit", function(e) {
  e.preventDefault();

  // Create an array of unchecked Hobbies
  var uncheckedValues = [];
  $(this).find("input[name='Hobbies']:not(:checked)").each(function() {
    uncheckedValues.push(this.value);
  });

  // Set the uncheckedValues array as hidden input value
  $("#your-hidden-input").val(uncheckedValues);
  alert($("#your-hidden-input").val());

  // Handle the form submission
  handleFormSubmit();
});

DEMOを参照してください。

于 2013-02-18T20:27:07.767 に答える
0

バックエンドの各チェックボックスにデフォルトのfalse値を設定するのはどうですか。ブラウザから値が渡された場合は、値をtrueに変更できます。

于 2013-02-18T20:31:55.653 に答える
0

私はそれを解決しました。そのアイデアはIMSoPの答えにありました。これが私の解決策です、多分それは誰かを助けることができます：

<fieldset>
    <legend>Whatever1</legend>
    <div class="checkbox-list">
        <input type="hidden" name="Hobbies_Arts">
        <label class="checkbox inline"><input type="checkbox" name="Hobbies" value="Arts"> Arts</label>
        <input type="hidden" name="Hobbies_Bars">
        <label class="checkbox inline"><input type="checkbox" name="Hobbies" value="Bars"> Bars</label>
        <input type="hidden" name="Hobbies_Books">
        <label class="checkbox inline"><input type="checkbox" name="Hobbies" value="Books"> Books</label>
        (more items)
    </div>
</fieldset>

これで、django側のリストを非常に簡単に処理できます。

于 2013-02-18T21:36:44.763 に答える