如何基于mvc中的下拉控件绑定复选框列表

时间:2017-05-19 07:06:04

标签: .net model-view-controller

我是mvc的新手  所以请帮助:: 如何根据mvc

中的下拉控件绑定复选框列表

1 个答案:

答案 0 :(得分:0)

检查以下代码

                        <html xmlns="http://www.w3.org/1999/xhtml">
                        <head>
                            <title>Department - Subject </title>

                            <script>
                                function CallSatateData() {
                                    $.ajax({
                                        type: 'POST',
                                        url: '@Url.Action("GetSubjects")',
                                        dataType: 'json',
                                        data: { id: $("#DepartmentID").val() },
                                        success: function (states) {
                                            $("#Subjectlist").empty();
                                            var content = "";
                                            $.each(states, function (i, state) {
                                                content += '<input type="checkbox" name="' + state.SubjectId + '" id="' + state.SubjectName + '"/>' + state.SubjectName + '</br>';
                                            });
                                            $('#Subjectlist').html(content);
                                        },
                                        error: function (ex) {
                                            alert('Failed to retrieve states.' + ex);
                                        }
                                    });
                                }

                                $(document).ready(function () {
                                    $("#DepartmentID").change(function () {
                                        CallSatateData();
                                    })
                                });

                                $(document).ready(function () {
                                    $('#someButton').click(function () {
                                        var list = [];
                                        $('#Subjectlist input:checked').each(function () {
                                            list.push(this.name);
                                        });
                                        // now names contains all of the names of checked checkboxes
                                        // do something with it for excamle post with ajax
                                        $.ajax({
                                            url: '@Url.Action("SaveSubject", "Student")',
                                            type: 'POST',
                                            data: { Parameters: list },
                                            success: function (result) {
                                            },
                                            error: function (result) {
                                                alert("error!");
                                            }
                                        });   //end ajax
                                    });
                                });
                            </script>
                        </head>
                        <body>

                            <div class="form-group">
                                @Html.DropDownList("DepartmentID", new SelectList(ViewBag.Department, "DepartmentID", "DepartmentName", ViewBag.DepartmentID), new { style = "width: 200px;" })
                            </div>
                            <div class="form-group" id="Subjectlist">
                                @if (ViewBag.DepartmentID > 0)
                                {
                                    <script>
                                        CallSatateData();
                                    </script>
                                }
                            </div>
                            <div class="form-group">
                                <input type="button" name="OK" id="someButton" />
                            </div>

                        </body>
                        </html>



     ---------------------

                      [HttpGet]
                    public ActionResult SetDepartment(int id = 0)
                    {
                        ViewBag.DepartmentID = id;
                        ViewBag.Department = unitOfWork.DepartmentRepository.Get().ToList();
                        return PartialView("SetDepartment");
                    }

                    public JsonResult GetSubjects(int id)
                    {
                        List<SubjectMaster> subjectMaster = unitOfWork.SubjectRepository.Get().Where(a => a.DepartmentId == id).ToList();
                        List<SubjectData> subjectDatas = new List<SubjectData>();
                        foreach (SubjectMaster item in subjectMaster)
                        {
                            SubjectData subjectData = new SubjectData();
                            subjectData.SubjectId = item.SubjectId;
                            subjectData.DepartmentId = item.DepartmentId;
                            subjectData.SubjectName = item.SubjectName;
                          //  subjectData.isChecked = 

                            subjectDatas.Add(subjectData);
                        }

                        return Json(subjectDatas, JsonRequestBehavior.AllowGet);
                    }


                    public ActionResult SaveSubject(string[] Parameters)
                    {


                        return View("index");
                    }