Question

嗨，我认为我有两个Drodowns。 客户名称和联系人。如果我选择CustomerName相关联的ContactPerson必须在ContactPerson下拉列表中自动加载。我执行了此任务。它完美的工作。

我的输出将与下图中提到的相同。

现在我需要的是我想改变输出的格式。

我需要更改输出格式，就像第二张图片中提到的那样。也就是说，如果我在下拉列表中选择值，则表示每个下拉列表包含First值，请选择。我在每个下拉列表中都需要这个。我尝试了很多方法，但我没有为我的代码获得正确的解决方案。请任何人给我这个任务的解决方案..

我的控制器代码

  public JsonResult GetCustomers()
    {
        return Json(db.Customers.ToList(), JsonRequestBehavior.AllowGet);
    }

   public JsonResult GetContactPersobByCustomerId(string customerId)
    {
        Guid Id = Guid.Parse(customerId);
        var customercontacts = (from a in db.CustomerContacts where a.CustomerID == Id select a);
        return Json(customercontacts, JsonRequestBehavior.AllowGet);
    }

我的ViewCode

  @Html.Label("Customer Name", new { @class = "control-label" })
  @Html.DropDownListFor(model => model.CustomerID, new SelectList(string.Empty, "Value", "Text"), "Please select a Customer", new { @class = "form-control required", type = "text" })

 @Html.Label("Contact Person", new { @class = "control-label" })
 @Html.DropDownListFor(model => model.CustomerContactID, new SelectList(string.Empty, "Value", "Text"), "Please select a ContactPerson", new { @class = "form-control", type = "text", id = "CustomerContactID" })

我的Json代码

  <script>
    $(function () {
    $.ajax(
   '@Url.Action("GetCustomers", "VisitorsForm")',{
            type: "GET",
            datatype: "Json",
            success: function (data) {
                $.each(data, function (index, value) {
                    $('#CustomerID').append('<option value="' + value.CustomerID + '">' + value.DisplayName + '</option>');
                });
            }
        });


          $('#CustomerID').change(function () {
        $('#CustomerContactID').empty();

        $.ajax(
             '@Url.Action("GetContactPersobByCustomerId", "VisitorsForm")',{
                type: "POST",
                datatype: "Json",
                data: { CustomerID: $('#CustomerID').val() },
                success: function (data) {
                    $.each(data, function (index, value) {
                 $('#CustomerContactID').append('<option value="' + value.CustomerContactID + '">' + value.ContactReference + '</option>');

              });
            }
         });
     });
 });

这是编码完美的工作，并根据我在第一张图片中提到的输出。现在我需要将此输出更改为第二种图像格式。我尝试了很多代码，但没有用。请任何人给我建议。

预先谢谢。

MVC4中的级联下拉？

0 个答案: