MVC4 jquery to deselect Html.CheckboxListFor

MVC4 jquery to deselect Html.CheckboxListFor

本文关键字：Html CheckboxListFor deselect to jquery MVC4      更新时间：2023-09-26

我正在使用jquery来显示和隐藏搜索页面的各个部分。我有一个 Html.Textbox 和 Html.CheckboxList，我根据表单输入显示和隐藏（提交表单时，如果文本框中没有输入任何内容，它将显示/隐藏文本框，复选框部分也是如此，如果在提交表单时未选中复选框，则当页面重新显示时复选框部分将被隐藏。我还使用 jquery .click 函数根据需要显示/隐藏这些搜索选项。

点击函数的代码：

    $('b.Text').click(function () {
        $('div.TSearch').slideDown(200);
        $('div.KSearch').slideUp(200);
    });

    $('b.Keyword').click(function () {
        $('div.KSearch').slideDown(200);
        $('div.TSearch').slideUp(200);
        $('#SearchString').val('');
    });

    $('b.Both').click(function () {
        $('div.KSearch').slideDown(200);
        $('div.TSearch').slideDown(200);
    });
@using (Html.BeginForm())
{
    <div>
        <!-- For styling the check boxes & text for the keywords section -->
        <style type="text/css">
            label {
                display: inline-block;
                padding: 5px;
                font-size:small;
            }
            input[type="submit"] {
                margin-left: 0px;
            }
        </style>
        @{ var htmlListInfo = new HtmlListInfo(HtmlTag.table, 5, null,
                                  TextLayout.Default, TemplateIsUsed.No);
        }
        @Html.CheckBoxListFor(model => model.KeywordIDs,
                              model => model.Keywords,
                              model => model.KeywordId,
                              model => model.Name,
                              model => model.SelectedKeywords,
                              htmlListInfo
        )
    </div>
}

编辑

视图模型：

public class SearchCasefileViewModel
{
    public Casefile Casefile;
    public Keyword Keyword;
    public IEnumerable<Casefile> Casefiles { get; set; }
    public IEnumerable<Keyword> Keywords { get; set; }
    public IList<Keyword> SelectedKeywords { get; set; }
    public List<string> KeywordIDs { get; set; }
}

如您所见，当您单击关键字时，它会隐藏文本框并清除文本框。我尝试通过使用Model.SelectedKeywords.Clear（）为复选框实现相同的功能，但这不会更新页面视图，因此复选框仍处于选中状态。是否有可用于清除复选框的类似调用？

对于要取消选中所有框的客户端解决方案，您可以在隐藏复选框部分时使用此选项：

// this selector is a bit general and you should use an id or class tagged on the
// checkbox section to make it more specific
$('form:checkbox').prop('checked', false);
相关文章：