12

我正在使用 MVC4，并且布局中有一个菜单。我的菜单的一部分包含一个下拉列表，用户可以在其中选择可用的提供商。

<div class="row">
    <div class="col-md-4">
    @Html.DropDownListFor(x=> x.usr.DatUsrs.IdProvider, new SelectList(Lista, "Value","Text"))
    </div>
    <div class="col-md-3">
      Credit
      @Html.DisplayTextFor(x=> x.usrSelectedProvider.AvailiableCredit)
    </div>
    <div class="col-md-3">
      TEXT
    </div>
    <div class="col-md-2">
      Closing Day  @Html.DisplayTextFor(m=> m.usrSelectedProvider.ClosingDay)
    </div>
  </div>

我遇到的问题是：当用户更改下拉列表中的选定项目时，我想进行回发以便能够加载 AvailiableCredit 和 ClosingDay。在网络表单中，我可以使用自动回发来做到这一点，但我还没有找到在 MVC4 中做到这一点的方法

4

3 回答 3

25

有几种方法可以做到这一点，但首先你需要了解你正在做的事情的结构。

它不是 MVC 中的“回发”（或者，实际上，一般来说，在 HTTP 中……WebForms 对你撒谎）。您要做的只是将数据发布到服务器并接收响应。在 MVC 框架中，该帖子的目标是控制器操作。响应可以是几个不同的事情，具体取决于您采取的方法。

我建议编写一些 JavaScript 来通过 AJAX 执行此任务。这样页面不会刷新，您只是发送/接收与手头特定任务相关的数据。ASP.NET MVC 带有 jQ​​uery，所以我将假设在这种情况下使用 jQuery。

首先，您需要绑定到该select元素的更改事件。它可能用id“IdProvider”标识，但您需要检查呈现的 HTML 以确保。假设它是，你可以使用这样的东西：

$('#IdProvider').change(function () {
    // respond to the change event in here
});

现在您可以在该处理程序中对服务器进行 AJAX 调用。它可能很简单：

var selectedValue = $('#IdProvider').val();
$.post('@Url.Action("MyAction", "MyController")', { selection : selectedValue }, function (data) {
    // handle the server response here
});

有了这个，控制器操作将在一个名为的参数中使用选定的值selection：

public ActionResult MyAction(string selection)
{
    // do your server-side processing and get your data
    return Json(data);
}

此操作返回 Json 格式的数据，因为客户端上的 JavaScript 正在使用它。因此，在处理上述$.post()调用中的响应时，您将在该data值中获得该数据。

您如何处理 JavaScript 代码中的数据取决于您自己。如果它是一个包含您正在寻找的两个值的简单结构，它可能就像这样简单：

$('#AvailableCredit').text(data.AvailableCredit);
$('#ClosingDay').text(data.ClosingDay);

或者，您可以select将元素包装在 a 中form并在选择更改时发布整个内容，然后控制器操作将希望返回 aView并在该视图中填充数据。但这可能有点矫枉过正，因为您要做的就是发送一个值并接收两个值。

于 2013-11-12T15:38:13.857 回答
1

免责声明 ：这种方法将提交整个表单。如果可能，最好执行 Ajax 操作而不是表单提交。David 的回答解释了如何进行 Ajax 调用。

如果将类data-on-change-submit添加到选择列表（或任何应触发回发的输入元素）。然后可以添加事件处理程序；它将提交更改表格，如下所示。

$(function () {
    $(".data-on-change-submit")
        .change(function ()
                {
                   var form = button.closest("form");
                   form.submit();
                })
});
于 2017-06-17T21:31:55.300 回答
0

In MVC there is no need for a post back, When the user selects from the dropdown, redirecect to the same action again but this time the action will have a HttpPost attribute (that will be your postback). Then you can do whatever you like and re-render the same view but this time with a new view model (having your new data loaded: AvailiableCredit and ClosingDay)

    public ActionResult DisplayMainView()
    {    
      LoadDataOnDropDown();    
      return View();    
    }

on the dropdown when a user selects the value, redirect to action (with httpPost) and give whatever value you need to reload the data.

[HttpPost]
public ActionResult DisplayMainView(string selectedValueFromDropdown) {

// get AvailiableCredit and ClosingDay  based on selection
ViewBag.AvailiableCredit = myService.GetAvailiableCredit (selectedValueFromDropdown);
ViewBag.ClosingDay   = myService.GetClosingDay (selectedValueFromDropdown);

return View;

}

This a pseudo-code that illustrate how you should use HttpPost to simulate the webForm postback. N.B.:I Used the viewbag but I would suggest using a seperate viewmodel for every view you create.

于 2013-11-12T15:30:54.347 回答