【问题标题】:How to return Multiple Parameters using json in mvc4?如何在 mvc4 中使用 json 返回多个参数?
【发布时间】:2016-03-05 13:47:45
【问题描述】:

嗨,我的视图中有四个字段CustomerNameContactPersonEmailMobileNo

CustomerNameContactPerson 是级联下拉菜单,EmailMobileNo 是文本框。

如果我选择CustomerName 相关的ContactPerson 将在ContactPerson 下拉列表中自动加载。

如果我选择Contactperson,则ContactPerson 相关的EmailPhoneNo 将自动加载到EmailPhoneNo 文本框中。我完全完成了所有任务,并且一切正常。现在我需要的是我希望减少代码。

我的控制器代码

    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);
    }

  public JsonResult GetEmailByContactPersonID(Guid CustomerContactId)
     {
      var ContactID = db.CustomerContacts.Where(i => i.CustomerContactID == CustomerContactId).Select(i => i.ContactID).FirstOrDefault();
      var contact1 = (from p in db.Contacts where p.ContactID == ContactID select p).FirstOrDefault().Email1;
        if (contact1 == null)
        {
            var contact2 = (from a in db.Contacts where a.ContactID == ContactID select a).FirstOrDefault().Email2;
            contact1 = contact2;
        }
        return Json(contact1, JsonRequestBehavior.AllowGet);
     }

 public JsonResult GetPhoneNoByContactPersonID(Guid CustomerContactId)
    {
        var ContactID = db.CustomerContacts.Where(i => i.CustomerContactID == CustomerContactId).Select(i => i.ContactID).FirstOrDefault();
        var mobile1 = (from pn in db.Contacts where pn.ContactID == ContactID select pn).FirstOrDefault().Mobile1;
        if (mobile1 == null)
        {
            var mobile2 = (from a in db.Contacts where a.ContactID == ContactID select a).FirstOrDefault().Mobile2;

            mobile1 = mobile2;
        }
        return Json( mobile1, JsonRequestBehavior.AllowGet);
    }

我的查看代码

   @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" })

   @Html.LabelFor(model => model.MobileNo, new { @class = "control-label" })
   @Html.TextBoxFor(model => model.MobileNo, new { @class = "form-control", type = "text",disabled = "disabled", @readonly = "readonly"  })
   @Html.ValidationMessageFor(model => model.MobileNo)

    @Html.LabelFor(model => model.Email, new { @class = "control-label" })
    @Html.TextBoxFor(model => model.Email, new { @class = "form-control", type = "text" ,disabled = "disabled", @readonly = "readonly" })
    @Html.ValidationMessageFor(model => model.Email)

我的 Json 代码

    <script src="~/Scripts/jquery-ui-1.11.0.js"></script>
   <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) {
            $('#CustomerContactID').append($('<option></option>').val('').text('Please select'));
                    $.each(data, function (index, value) {
                 $('#CustomerContactID').append('<option value="' + value.CustomerContactID + '">' + value.ContactReference + '</option>');
                   });
                  }
               });
            });
        });

  $("#CustomerContactID").change(function () {
           alert("hhh");
    $.ajax(
        '@Url.Action("GetEmailByContactPersonID", "VisitorsForm")',{
            type: "GET",
            dataType: "json",
            async: false,
            data: { CustomerContactID: $("#CustomerContactID").val()
            },
            error: function (ex) {
                alert('Failed to retrieve Email.' + ex);
            },
            beforeSend: function () {
            },
            success: function (data) {
                $("#Email").val(data);
                             }
                         });
                     });

   $("#CustomerContactID").change(function () {
     alert("hhh");
    $.ajax(
        '@Url.Action("GetPhoneNoByContactPersonID", "VisitorsForm")',{
            type: "GET",
            dataType: "json",
            async: false,
            data: { CustomerContactID: $("#CustomerContactID").val()
            },
            error: function (ex) {
                alert('Failed to retrieve Email.' + ex);
            },
            beforeSend: function () {
            },
            success: function (data) {

                $("#MobileNo").val(data);
            }
          });
        });

查看我的编码,我为EmailPhoneNo 编写了单独的json 和jquery,ajax 代码。我觉得不好。我想缩短我的代码。我想使用json传递多个参数。我想在ContactPerson 下拉列表中选择ContatcPerson 时传递Emailphone。它也会影响我的应用程序的性能。请任何人为我的问题提供解决方案和建议。

提前谢谢..

【问题讨论】:

  • 您只需要一个 $("#CustomerContactID").change(function () { 调用一个控制器方法(比如)GetContactPersonDetails() 它将两个值作为匿名对象返回(请参阅 Andreas Pilavakis 的答案),然后使用 $("#Email").val(data.email);$("#MobileNo").val(data.phone);

标签: c# jquery json ajax asp.net-mvc-4


【解决方案1】:

您为什么不从控制器返回一个包含您需要的所有信息的对象?

任何序列化为 Json 的对象都可以作为 JsonResult 返回。

你甚至可以做匿名类型,比如:

var details = new { email = "test@test.com", phone = "1234567"};
return Json(details);

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2014-07-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-07-27
    • 1970-01-01
    相关资源
    最近更新 更多