-2

動的に生成されたチェックボックスを含むビューと、すべてのチェックボックスをチェック/チェック解除するためのボタンがあります。以下のコードを試してみましたが、ボタンのクリックイベントでチェックボックスがチェックされていません。助けてください。ありがとうございました。

チェックボックスで表示: 

 <button id="selectinvert" name="selectinvert" class="clear-selection ui-btn-hidden" aria-disabled="false" > Select / Deselect All</button>
    @for (int i = 0; i < @Model.workDaysList.Count; i++)
        {
              <div class="framed">
                 <div data-role="collapsible" data-collapsed="true" class="ui-btn-inner ui-corner-top ui-corner-bottom">
                   <h3>
                            <div class="ui-checkbox" id="checkbox">
                                <input type="checkbox" id="@Model.workDaysList[i][0]" />
                                <span class="ui-btn-text">
                                    <label for="@Model.workDaysList[i][0]" data-theme="c">
                                        @Model.workDaysList[i][1].Substring(6, 2)/@Model.workDaysList[i][1].Substring(4, 2)/@Model.workDaysList[i][1].Substring(0, 4)
                                    </label>
                                </span>
                                </div>
                            </h3>
                            @Model.detailDaysList[i][0] / @Model.detailDaysList[i][1]
                            <br />
                            @Model.detailDaysList[i][2] / @Model.detailDaysList[i][3]
                            <br />
                            @Model.detailDaysList[i][4] h
                        </div>
                    </div>
                </div>
           }

Jクエリコード:

<script type="text/javascript">
     $(document).ready(function () {
       $("#selectinvert").click(function () {
       $("INPUT[type='checkbox']").each(function () {
                    if (this.checked == false) {
                        this.checked = true;
                    } else {
                        this.checked = false;
                    }
                });
          });
    });
    </script>
4

6 に答える 6

3

これを試して：

<script lang='javascript'>
 $(document).ready(function(){
     $('#selectinvert').click(function(){
         $("input[type='checkbox']").each(function (){
             if($(this).is(':checked')){
                 $(this).prop('checked', false);
             }else{
                 $(this).prop('checked', true);
             }
        });
     })
 });
</script>
于 2012-10-22T08:10:50.023 に答える
2

基本的な HTML コードから始めて、その上に構築してみてください! モデル コードが HTML を妨げている可能性があります。ここで動作するプロトタイプを見つけることができます!

<button id="selectinvert" name="selectinvert" class="clear-selection ui-btn-hidden" aria-disabled="false" > Select / Deselect All</button>
<div class="framed">
    <div class="ui-checkbox" id="checkbox">
        <input type="checkbox" id="@Model.workDaysList[i][0]" />
        <span class="ui-btn-text">First</span>
    </div>
    <div class="ui-checkbox" id="checkbox">
        <input type="checkbox" id="@Model.workDaysList[i][0]" />
        <span class="ui-btn-text">Second</span>
    </div>
</div>

$("#selectinvert").click(function() {

    $("INPUT[type='checkbox']").each(function() {
        if (this.checked == false) {
            this.checked = true;
        } else {
            this.checked = false;
        }
    });
});
于 2012-10-22T08:15:26.580 に答える
2

終了があります}）行方不明..

ところで：トグルは次のように書くことができます：

this.checked = !this.checked
于 2012-10-22T07:49:22.160 に答える
1

あなたが書いたコードは、すべてのチェックボックスがオンまたはオフの場合にのみ機能すると思います.. What happens when some of them are checked..コードはそれらを切り替えるだけです..

ロジックは、チェックボックスではなくボタンに依存する必要があります..

$(document).ready(function() {
    var isChecked = false;
    $("#selectinvert").click(function() {
        var $checkboxes = $("INPUT[type='checkbox']") ;
        if(isChecked){
            isChecked = false;
        }
        else{
            isChecked = true;
        }
        $checkboxes.prop('checked' , isChecked);
    });
});​
于 2012-10-22T08:01:12.910 に答える
1

他の人が示唆しているように、閉じ括弧がありませんでした。

コードを少し短くすることもできます。

$("#selectinvert").click(function() {
    $("input[type='checkbox']").each(function() {
        this.checked = !this.checked;
    });
});

また、問題は ASP.NET または jQuery UI とは何の関係もないことに注意してください。</p>

于 2012-10-22T07:54:20.493 に答える
1

試す

 $("#selectinvert").click(function () {
 $("INPUT[type='checkbox']").each(function () {
                if (!$(this).is(":checked")) {
                    $(this).attr('checked','checked');
                } else {
                    $(this).removeAttr('checked','checked');
                }
                })
            });
于 2012-10-22T07:55:08.027 に答える