如何将带有复选框的下拉列表绑定到另一个下拉列表选择 [英] How to bind dropdownlist with checkbox to another dropdownlist selection

问题描述

我正在尝试在下拉列表选择上绑定一个复选框列表，我已经能够在Lab选定索引更改的多选下拉列表上显示一个列表，但是我无法将复选框添加到多选下拉列表中.任何帮助将不胜感激.

我尝试过的事情:

我的Ajax功能:

I am trying to bind a checkboxlist on dropdownlist selection, i have been able to display a list on a multiselect dropdownlist on Lab selected index change, but adding a checkbox to the multiselect dropdown list is what i have not been able to do. Any assistance will be appreciated.

What I have tried:

My Ajax Function:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/jscript">
    $(document).ready(function () {
        $('#LabId').change(function () {
            $(".spina").show();
            $("#testType").prop("disabled", true);
            $.getJSON('/Lab/GetTestTypeList/' + $('#LabId').val(), function (data) {
                var items = '<option value = "0">---Select a Test Type---</option>';
                $.each(data, function (i, testType) {
                    items += "<option value='" + testType.Value + "'>" + testType.Text + "</option>";
                    $("#testType").prop("disabled", false);
                    $(".spina").hide();
                });
                $('#testType').html(items);
                $("#testType").prop("disabled", false);
                $(".spina").hide();
            });
        });
    });
</script>

我的HTML控件:

My HTML Controls:

<div class="col-sm-7">
   <div class="form-group">
@Html.LabelFor(model => model.LabId, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
   @Html.DropDownListFor(model => model.LabId, (IEnumerable<SelectListItem>)ViewBag.LabList, "---Select Lab---", new { @class = "form-control" })
  @Html.ValidationMessageFor(model => model.LabId, "", new { @class = "text-danger" })
 </div>
 </div>
  </div>


 <div class="col-sm-7">
   <div class="form-group">
   @Html.LabelFor(model => model.TestTypeId, htmlAttributes: new { @class = "control-label col-md-2" })
   <div class="col-md-10">
      <select id="testType" name="testType" multiple="multiple" class="form-control" required="required">
   <option value="0">---Select a Test Type---</option>
     </select>
       @Html.ValidationMessageFor(model => model.TestTypeId, "", new { @class = "text-danger" })
     </div>
       </div>
         </div>

我的C#代码:

My C# Code:

private void LoadLabDropDownList()
        {
            try
            {
                var getList = repository.GetSpecialtyListByRoleId(8);
                var items = getList.Select(t => new SelectListItem
                {
                    Text = t.FullName,
                    Value = t.UserId.ToString()
                }).ToList();

                ViewBag.AccountantList = items;
            }
            catch (Exception ex)
            {
                ViewBag.DisplayMessage = "Info";
                ModelState.AddModelError("", ex.Message);
            }
}

加载第二个下拉列表的代码:

The code to load the second dropdown list:

public JsonResult GetTestTypeList(string id)
        {
            if (!string.IsNullOrEmpty(id))
            {
                var labId = Convert.ToInt32(id);
                var testTypes = from s in db.TestTypes
                           where s.LabId == labId
                                select s;
                return Json(new SelectList(testTypes.ToArray(), "TestTypeId", "TestName"), JsonRequestBehavior.AllowGet);
            }
            else
            {
                var testTypeId = Convert.ToInt32(id);
                var testTypes = from s in db.TestTypes
                                where s.TestTypeId == 0
                                select s;
                return Json(new SelectList(testTypes.ToArray(), "TestTypeId", "TestName"), JsonRequestBehavior.AllowGet);
            }
        }

        [AcceptVerbs(HttpVerbs.Get)]
        public JsonResult LoadTestTypeByLabId(string labName)
        {
            var labList = GetTestType(Convert.ToInt32(labName));
            var labData = labList.Select(m => new SelectListItem()
            {
                Text = m.TestName,
                Value = m.TestTypeId.ToString(),
            });
            return Json(labData, JsonRequestBehavior.AllowGet);
        }

        public IList<TestType> GetTestType(int testTypeId)
        {
            return db.TestTypes.Where(m => m.TestTypeId == testTypeId).ToList();
        }

推荐答案

(文档).ready(

(document).ready(function () {

(#LabId' ).change(函数(){

('#LabId').change(function () {

(" .spina").show();

(".spina").show();

这篇关于如何将带有复选框的下拉列表绑定到另一个下拉列表选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！