javascript - 将 DropDown 字符串从 View 传递到 Controller 方法

Question

我的问题是一个两部分的问题。

1) 我正在尝试通过 ajax 调用将一个字符串从我的索引 View 传递到一个方法 (UpdateView(string selectProductionLine))。我可以获得调用该方法的 ajax 调用，但我无法将字符串设为 null。

2) 调用此方法 (UpdateView(string selectProductionLine)) 后，我希望它更新模型，然后使用更新后的方法调用局部 View 。目前我无法调用该部分 View 。

我一直在查看几种不同的尝试，链接如下，但一直无法让它发挥作用。我的 JS 不是那么好，我还是个初学者，我很难结合别人所做的。

索引 View :

@(Html.Kendo().DropDownList()
      .Name("productionLine-dropdown")
      .DataTextField("Name")
      .DataValueField("Id")
      .DataSource(source =>
      {
           source.Read(read => { read.Action("GetDropDownList", "Home"); });
      })
      .Events(e =>
      {
           e.Close("OnClose");
      })
)
<div id="Dashboard">
@Html.Partial("~/Views/Home/_Home.cshtml", Model)
</div>

Java 脚本:

function OnClose() {
    var selectProductionLine = $("#productionLine-dropdown").data("kendoDropDownList").value();
    $("#Dashboard").load('/Home/UpdateView', selectProductionLine);
}

function DropDownValue() {
    var value = $("#productionLine-dropdown").data("kendoDropDownList").value();
    return { selectProductionLine: value };
}

Controller :

public ActionResult _Home(DisplayViewModel dvm)
{
    return PartialView(dvm);
}

public ActionResult UpdateView(string selectProductionLine)
{
    DisplayViewModel dvm = new DisplayViewModel();
    //Some logic
    return PartialView("~/Home/_Home.cshtml", dvm);
}

问题:

1) 将索引中的字符串传递给 UpdateView() 方法。

2) 使用新的 ViewModel 从 UpdateView() 调用 _Home 部分 View 。

谢谢!

Updating PartialView mvc 4

Refreshing MVC PartialView with new Model on DropDownList Change

Passing a List/model from a View to a controller

https://cmatskas.com/update-an-mvc-partial-view-with-ajax/

Answer 1

好的，这里有两个问题。

Javascript

首先，将您的 .Load 方法更改为简单地将 selecProductionLine 值连接到 URL 的末尾。

var selectProductionLine = $("#productionLine-dropdown").data("kendoDropDownList").value();
$("#Dashboard").load("/Home/UpdateView/" + selectProductionLine);

Controller Action

其次，您需要更改 UpdateView 函数以像这样接收 Id。

public ActionResult UpdateView(string Id)
{
    DisplayViewModel dvm = new DisplayViewModel();
    ProductionLine pl = _productionLineService.Find(Id);
    dvm.ProdLine = new ProductionLineViewModel
    {
        Id = pl.Id,
        CreatedAt = pl.CreatedAt,
        Name = pl.Name,
        ActiveLine = pl.ActiveLine,
        ComputerName = pl.ComputerName,
        UPE = pl.UPE
   };
   return PartialView("~/Home/_Home.cshtml", dvm);
}

这是因为 RouteConfig.cs 中的默认路由使用 {controller}/{action}/{id} 作为任何请求的默认路由。

路由配置

public class RouteConfig
{
    public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

        routes.MapRoute(
            name: "Default",
            url: "{controller}/{action}/{id}",
            defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
        );
    }
}