0

リストにある各アイテムのチェックボックスをオン/オフにする「パワー」を持つチェックボックスを作成したいと思います。

これが私が今それを構築したときのビューの一部です（誤った名前と慣習に耐えてください）：

    <p>
        @using (Html.BeginForm("SendObj", "Manager"))
        {
            <p>
               Select / UnSelet All Items @Html.CheckBox("selectAll", true) 
            </p>
            <table id="objToSend">
                <tr>
                    <th>Obj Name</th>
                    <th>Number In Stock</th>
                    (...)
                </tr>
                @for (int i = 0; i < Model.Count(); i++)
                {
                    <tr>
                        <td>@Html.DisplayFor(x => x[i].m_OthObj.m_ObjName)</td>
                        <td>@Html.DisplayFor(x => x[i].m_NbInStock)@Html.HiddenFor(x => x[i].m_NbInStock)</td>
                        (...)
                    <div id="divChckBox">
                        <td>
                            @Html.CheckBoxFor(x => x[i].m_IsSelected)
                        </td>
                    </div>

                    </tr>
                }

            </table>
            <input type="submit" value="Send"/>
        }
    </p>

「方法」については、少し調べて、このjqueryスクリプトを試しましたが、役に立ちませんでした。

    **** EDIT ****

以下に投稿されたコメントに基づいた新しいjQueryを次に示します。アラートはデバッグ目的で存在し、必要に応じて両方が表示されます。

    <script type="text/javascript">
    $(document).ready(function() {
        alert("The document is ready");
        $("#selectAll").click(function() {
            alert("The case has been clicked");
            var chkValue = $(this).is(":checked");
            $("#divChckBox").attr("checked", "checked");
        });
    });
    </script>

私はjqueryを使用してもかまいませんが、それがどのように機能するかはまだわかりません。たぶんそれが私が考えていることがうまくいかない理由です。

誰かが私を助けることができますか？ありがとうございました！

* 編集 *

ここに、レンダリングされたページがチェックボックスに対して提供するものを追加します。

<td><input checked="checked" class="chckBoxList" data-val="true" data-val-required="The m_IsSelected field is required." name="[0].m_IsSelected" type="checkbox" value="true" /><input name="[0].m_IsSelected" type="hidden" value="false" /></td>

多分それは何が起こっているかについてのより多くの情報を与えるでしょう。

4

3 に答える 3

1

私は正直に立っています： CheckBoxForはクラス設定を許可していません

あなたのヘルパーで

<div id="divChckBox">
  @Html.CheckBoxFor(x => x[i].m_IsSelected)
</div>

次に、クラスごとにセレクターグループを作成します。

$("#divChckBox :checkbox").attr("checked", "checked");
于 2013-03-08T18:53:13.380 に答える
1 
@Html.CheckBox("TheOneCheckBoxToRuleThemAll")

現在のチェックボックスコードを次のように変更します。

<td>@Html.CheckBoxFor(x => x[i].m_IsSelected, new{ @class = "checkGroup1"})</td>

これまでで最も簡単なJquery（図のようにdocument.readyに配置してください）：

  <script type="text/javascript">
    $(document).ready(function () {
         //alert("the document is ready"); 
         $("#TheOneCheckBoxToRuleThemAll").click(function () {
              //alert("inside my click event");
              var chkValue = $(this).is(":checked");
              $(".checkGroup1").prop("checked", chkValue);
          });
     });
  </script>

編集：

以前の回答では、.attr（）属性を使用しました。テストした後、私はそれを機能させるためにあらゆる種類の問題を抱えていました。このSO投稿を参照した後、.prop（）の使用に切り替え、すべてが魔法のように正しく機能し始めました。

編集：

私が提供した例では、チェックボックスは次のようになっている必要があります。

<input name='itdoesnotmatter' id='donotcare' class='checkGroup1' />

また、私がそこに付けたその愚かな名前を使用しないでください、次のような簡単なものを使用してください

@Html.CheckBox("MasterCheck")
于 2013-03-08T18:58:07.500 に答える
0

周りにはたくさんのコメントとたくさんの答えがあるので、これが私の現在のコードです（これはうまくいきます！）：

<script type="text/javascript">
    $(document).ready(function() {
        //alert("The document is ready");
        $("#selectAll").click(function() {
            //alert("The case has been clicked");
            var chkValue = $(this).is(":checked");
            $(".divChckBox").prop("checked", chkValue);
        });
    });
</script>
<p>
    @using (Html.BeginForm("SendObj", "Manager"))
    {
        <p>
            Select / UnSelet All Items @Html.CheckBox("selectAll", true) 
        </p>
        <table>
            <tr>
                <th>Card Name</th>
                <th>Number In Stock</th>
                (...)
            </tr>
            @for (int i = 0; i < Model.Count(); i++)
            {
                <tr>
                    <td>@Html.DisplayFor(x => x[i].m_OthObj.m_ObjName)</td>
                    <td>@Html.DisplayFor(x => x[i].m_NbInStock)@Html.HiddenFor(x => x[i].m_NbInStock)</td>
                    (...)
                    <td>
                        <input type="checkbox" name="itdoesnotmatter" class="divChckBox" checked="true"/>
                    </td>
                </tr>
            }

        </table>
        <input type="submit" value="Send"/>
    }
</p>

Now every checkboxes are checked or not depending on the state of the select all checkboxes! Thank you everyone. Now I need to solve the problem of "unlinking" the result of the checkbox in my controller because a behavior was linked to this. But it's another problem.

于 2013-03-08T20:43:59.937 に答える