MVC - html.dropdownlist - 直接调用javascript或控制器/方法？答案

【问题标题】：MVC - html.dropdownlist - calling javascript or controller/method directly?MVC - html.dropdownlist - 直接调用javascript或控制器/方法？
【发布时间】：2012-05-16 17:18:50
【问题描述】：

在我的 MVC 应用程序中，我的视图中有一个 html.dropdownlist。在选择更改时 - 我希望将值传递给控制器中的方法（返回类似列表或 JsonResult 的内容）。

Q1：我该怎么做？

 <%=Html.DropDownList("title", Model.Titleitems, "" )%>

Q2：这是一个好的做法（直接在视图中使用控制器/方法名称）还是我应该编写一个 JavaScript 函数并从该 JavaScript 函数内部调用适当的控制器/方法？在这种情况下，如何为上述 html.dropdownlist 控件编写 Onchange 或 OnSelectionChanged 事件？

编辑：

par1 是我要传递给此控制器/方法的下拉列表选择值..

       public ActionResult GetMethod(string Par1)
        {
            //My code here 

            return Json(varValue, JsonRequestBehavior.AllowGet); 
        }

现在我有一个关于更改的下拉列表，将我带到一个 JavaScript 函数（根据 marteljn 的建议），在 JavaScript 函数中，我有 .ajax 调用指定 URL 和类型等，将我带到控制器/方法代码；但仍然无法弄清楚如何将选定的值传递给控制器？

【问题讨论】：

标签： javascript asp.net asp.net-mvc asp.net-mvc-3 drop-down-menu

【解决方案1】：

Q2 是 Q1 的答案。使用 MVC 时没有像 Web 表单中那样的事件，因此您将编写一些 JavaScript 来向服务器发出请求。
有（至少）两种方法可以解决：

内联事件处理程序（不推荐）

<%=Html.DropDownList("title", Model.Titleitems, new{@onchange = "YourJsFuncHere()"} )%>

JQuery 方式，

$("#title").bind("change",function(){
     //Your Code  
     //Use .on instead of bind if you are using JQuery 1.7.x or higher   
     //http://api.jquery.com/on/ 
});

编辑 - AJAX 代码

$.ajax({
  "url": "/Controller/Action/" + $("#title").val(),
  "type": "get",
  "dataType" : "json",
  "success": function(data){
    //Your code here
    //data should be your json result
  }
});

将GetMethod(string Par1) 更改为GetMethod(string id) 或更改您的默认路由以反映Par1 参数。

此外，如果它没有达到您的断点，则可能是 1）AJAX 请求没有被启动（使用 firebug 来查看是否启动）2）您的路由配置不正确（查看 Global.asax.cs，如果您还没有将路由移动到其他地方。

【讨论】：

那么如果我使用 Jquery 方式，控制器/方法在哪里出现？因为我在控制器方法中有代码，它接受下拉选择的值并运行一些逻辑..
您可以 1) 在您的 JavaScript 函数中向控制器发出 AJAX 请求，例如 $.ajax({url : "/Controller/Action"... 2) 执行 location.href = "/Controller/Action";，这会将您发送到该页面。根据您的问题，我认为方法 1) 是您想要做的。
我试过 1).. 但控制器中的断点根本没有命中。我检查了 javascript 本身运行良好（使用警报）.. 这是到目前为止的代码.. $.ajax ({ url: '/ControllerA/MethodA', });以及如何将下拉列表值传递给需要参数的控制器操作方法
将方法从私有更改为公共 - 修复了断点问题。抱歉，不知道它是如何进入的。
函数（数据）代码的确切内容..就我而言，我所需要的只是将选定的值传递给控制器/方法..我认为您在到达之前已经这样做了该函数（数据）行代码..

【解决方案2】：

$(function(){
  $("#title").change(function(){
   var selectedVal=$(this).val();
   $.getJSON("UserController/YourAction",{ id: selectedVal} , function(result ){
       //Now you can access the jSon data here in the result variable
   });

 });

});

假设您的 UserController 中有一个名为 YourAction 的 Action 方法，该方法返回 JSON

public ActionResult YourAction(int id)
{
  //TO DO : get data from wherever you want. 

   var result=new { Success="True", Message="Some Info"};
   return Json(result, JsonRequestBehavior.AllowGet); 

}

【讨论】：