0

MVC3 カミソリ ページのフィルター チェックボックスの jQuery 表示非表示ボックスに取り組んでいます。

これらのチェックボックスがチェックされているかどうかによって変化するページがありますが、チェックボックスのいずれかがチェックされていない場合は開いたままにしておきたいです。

現在、表示/非表示は機能していますが、チェックボックスがオンになっているかどうかに基づいて、表示/非表示でページが読み込まれるかどうかを判断するにはどうすればよいですか?

いずれかがチェックされていないかどうかを示すブール値を返すことができます。これを達成するための最善/最も適切な方法を手伝ってくれる jQuery の天才を本当に探していました。

これはフィルターの 1 つの例です。ここで、modeFilterList は各チェックボックスの一般的なリストであり、名前、ID、およびチェック済みのステータスが含まれています。

<div id="filterwrap">
    <h2 class="filter">Filter your results</h2>
    @using (Html.BeginForm())
    {
    <ul id="filter">
        <li>
            <h2>                            
                <a href="#">Modes</a></h2>
            <div class="filtercontent">
                @foreach (var item in modeFilterList)
                {
                    <div class="radiorow">
                        @Html.CheckBox("mode_" + item.ID, item.Checked)
                        @item.Name
                    </div>
                }   
            </div>
            <!-- end of filtercontent -->
        </li>
    </ul>
    }
</div>

これは、表示と非表示の jquery コードです。

$('#filterwrap li h2').live('click', function (e) {
    $(this).next('div.filtercontent').slideToggle() ;
    e.preventDefault();  //stops page jumping to top
});

ページがリロードされたときに読み取ることができる h2 のすぐ下に true/false 値を含む隠しフィールドを用意することを考えましたが、jQuery でそれを行うもっと良い方法があるはずです!

4

2 に答える 2

2

Jquery toggle() 関数または $("componentID").show() または hide() 関数を使用できます

于 2012-04-26T09:05:13.737 に答える
0

わかりました、私がたどり着いた解決策に夢中ではないので、誰かがより良くてきちんとしたものを持っているなら、私に知らせてください.

したがって、フィルターごとに、チェックボックスが選択されているかどうかを表示するために、viewbag を介して bool パラメーターを渡します。

bool modeStatus = ViewBag.modeStatus;

次に、クラスでhiddenfieldを追加しました：

<div id="filterwrap">
    <h2 class="filter">Filter your results</h2>
    @using (Html.BeginForm())
    {
    <ul id="filter">
        <li>
            @Html.Hidden("mode", modeStatus, new { @class = "filteritem" })
            <h2>                            
                <a href="#">Modes</a></h2>
            <div class="filtercontent">
                @foreach (var item in modeFilterList)
                {
                    <div class="radiorow">
                        @Html.CheckBox("mode_" + item.ID, item.Checked)
                        @item.Name
                    </div>
                }   
            </div>
            <!-- end of filtercontent -->
        </li>
    </ul>
    }
</div>

(document).ready 内のこのコード

$("input.filteritem:hidden").each(function () {
    if ($(this).val() == "True") {            
        $(this).nextAll('div.filtercontent').show();
    }
});
于 2012-04-26T10:23:35.663 に答える