如何找到选中的复选框并将它们传递给MVC中的ActionResult?

时间:2014-12-29 17:06:03

标签: javascript jquery asp.net-mvc checkbox

我有一个MVC5应用程序,在我的一个观点中,我有类似的东西:

<div id="subcatsform" class="form-group" style="visibility:hidden;">
     @Html.LabelFor(m => m.Subcategories, new { @class = "col-md-3 control-label" })
     <div id="subcats" class="col-md-9">

      </div>
</div>

然后,在我的JavaScript部分中,为了填充空的div,我会这样做。

$(function () {

    $("#CategoryID").on("change", function () {
        var selected_option = $("#CategoryID option").filter(":selected").text();
        $("#subcats").empty();

        if (selected_option != "Please select a category") {
            $("#subcatsform").css("visibility", "visible");

            $.ajax({
                url: "/Home/GetSubcategories",
                dataType: "json",
                data: {
                    cid: $("#CategoryID").val(),
                },
                success: function (data) {
                    $.each(data, function (key, value) {
                        var checkbox = '<input type="checkbox" name="subcategory" value="' + value.id + '"> ' + value.value + '<br />';
                        $("#subcats").append(checkbox);
                    }); 
                }
            });
        }
        else
        {
            $("#subcatsform").css("visibility", "hidden");
        }
    });

});

因此,我只是检查先前选择的类别,然后相应地列出在该类别中找到的所有子类别,并为每个子类别创建输入复选框。这很好用,我可以在更改类别时获得相应的子类别,并为我创建复选框。

问题在于,当用户在视图的表单中按下提交按钮时,我不知道如何找出选中的复选框。

我的ActionResult定义如下:

public async Task<ActionResult> RegisterBusiness(BusinessViewModel model)

在我的BusinessViewModel中,我有一个如下定义的属性:

public virtual ICollection<Subcategory> Subcategories { get; set; }

任何想法,我如何获得所有选中的复选框,并在提交表单时获取其value属性?

1 个答案:

答案 0 :(得分:2)

假设您的SubCatagory类中有一个名为IsSelected的布尔属性。 您应该能够发送像这样的值

 var checkedList = $.map($(':input[name="Subcategory"]'),
   function(){
    var $this = $(this);
    return {
       name :$this.data('subcatagory'), // You can add the subcatagory as a data dash attribute or any other unique identifier in  html of the checkbox before appending
       IsSelected  : $this.is(':checked')
        }});
        $.ajax({
          url : '<your url>',
          type:"POST",
          contentType:"application/json; charset=utf-8",
          data : JSON.Stringify({
                  'Subcategories' :checkedList
                 })
        });