Asp.net mvc 在MVC中调用下拉列表选择的特定操作

我在MVC视图中有一个下拉列表。在下拉列表的选择更改时，我想调用控制器中的特定操作方法

我在view上所做的是：

<%=Html.DropDownList("ddl", ViewData["AvailableList"] as SelectList,
  new { onchange = "this.form.action='MyMethod';this.form.submit();" })%>

一切都在整理中。但是当我更改下拉选择时会引发运行时异常，如下所示

“Microsift JScript运行时错误：对象不支持属性或方法”

如何重定向到列表选择更改事件的特定操作？

---

如何将参数传递给此操作方法？

您真的需要提交表单吗？您可以重定向：

onchange = "redirect(this.value)"

其中，

重定向

是一个自定义函数：

function redirect(dropDownValue) {
    window.location.href = '/myController/myAction/' + dropDownValue;
}

function doSomething(action) {
    var firstName = $('#FirstName').val();
    var lastName = $('#LastName').val();
    $.load(action, { first: firstName, last: lastName });
}

---

这是一个jQuery的东西。给它上一节课，然后接上它

Html.DropDownList("ddl", AvailableList, new { @class = "_select_change" })

粗略的脚本可能如下所示：

$('._select_change').change(function() { $.post(ctrlUrl); })

<%= using (Html.BeginForm()) 
   { %>
    <table>
        <tr>
            <td>First Name:</td>
            <td><%= Html.TextBox("FirstName") %></td>
        </tr>
        <tr>
            <td>Last Name:</td>
            <td><%= Html.TextBox("LastName") %></td>
        </tr>
        <tr>
            <td>Assign to:</td>
            <td><%= Html.DropDownList(ddl, ViewData["items"] as SelectList, 
                new { onchange = string.format("doSomething({0}); return false;", ViewData["action"]) }) %></td>
        <tr>
    </table>
<% } %>

<%= Html.DropDownList(
        "ddl", ViewData["AvailableList"] as SelectList, 
        new { onchange = @"
            var form = document.forms[0]; 
            form.action='MyMethod';
            form.submit();" 
        } ) %>

两者都喜欢：D

我提出了一个组合——我非常喜欢jQuery

$('ddl').change(
 function() {
  // This contains your selected option val
  $(this).val();

// so you can do domething like...
  $.post(
    $(this).val(),
    { Param1: xxxx,
      Param2: xxxx,
      Param3: xxxx },
    function(data) {
     // handle your call here. 'data' contains the response
    } );
}

---

在控制器操作中，您将以相同的方式进行调用：

<%= Html.DropDownList(ddl, ViewData["items"] as SelectList, new { onchange = string.format("doSomething({0}); return false;", action) }) %>

如果是AJAX调用：

function doSomething(action) {
    window.location.href = action;
}

function doSomething(action) {
    $.load(action);
}

要将参数传递给操作，只需确保要传递的所有数据元素都包含在

标记中。例如，假设您希望在下拉列表中包含名字和姓氏。在视图中，您将执行以下操作：

$('._select_change').change(function() { $.post(ctrlUrl); })

<%= using (Html.BeginForm()) 
   { %>
    <table>
        <tr>
            <td>First Name:</td>
            <td><%= Html.TextBox("FirstName") %></td>
        </tr>
        <tr>
            <td>Last Name:</td>
            <td><%= Html.TextBox("LastName") %></td>
        </tr>
        <tr>
            <td>Assign to:</td>
            <td><%= Html.DropDownList(ddl, ViewData["items"] as SelectList, 
                new { onchange = string.format("doSomething({0}); return false;", ViewData["action"]) }) %></td>
        <tr>
    </table>
<% } %>

<%= Html.DropDownList(
        "ddl", ViewData["AvailableList"] as SelectList, 
        new { onchange = @"
            var form = document.forms[0]; 
            form.action='MyMethod';
            form.submit();" 
        } ) %>

---

你的方法应该有效。您遇到的问题是在

onchange

事件中使用

this

无效。尝试将您的

this.form

引用替换为以下内容：

$('._select_change').change(function() { $.post(ctrlUrl); })

<%= using (Html.BeginForm()) 
   { %>
    <table>
        <tr>
            <td>First Name:</td>
            <td><%= Html.TextBox("FirstName") %></td>
        </tr>
        <tr>
            <td>Last Name:</td>
            <td><%= Html.TextBox("LastName") %></td>
        </tr>
        <tr>
            <td>Assign to:</td>
            <td><%= Html.DropDownList(ddl, ViewData["items"] as SelectList, 
                new { onchange = string.format("doSomething({0}); return false;", ViewData["action"]) }) %></td>
        <tr>
    </table>
<% } %>

<%= Html.DropDownList(
        "ddl", ViewData["AvailableList"] as SelectList, 
        new { onchange = @"
            var form = document.forms[0]; 
            form.action='MyMethod';
            form.submit();" 
        } ) %>

@Shimmy有没有一种方法可以将其作为一个衬里来完成，而无需定义 js中的函数

是的，您可以，下面是代码：

@Html.DropDownListFor(m => m.Name, new SelectList((System.Collections.IEnumerable)ViewBag.DropDownName, "Value", "Text"), new { @class = "form-control", onchange = "document.location.href = '/Home/Employee?c=' + this.options[this.selectedIndex].value;" })

---

我尝试了这个方法，但它只在我将参数作为查询字符串传递时有效，例如：window.location.href='/myController/myAction？param='+dropDownValue@fjxx，您应该能够通过重新配置您的@Darin Dimitrov，有没有办法不在js中定义函数而将其作为一个单行程序来解决此问题？@Shimmy，有办法：

onchange=“window.location.href=”/myController/myAction/“+this.value；”

@Shimmy，没有办法

Url.Action

在服务器上运行，而

此.value

仅在客户端上已知。正确的方法是将此下拉列表放在带有提交按钮的HTML表单中，这样就不需要使用javascript手动创建URL。这里%=是什么意思？我不能remember@JamesJoshuaStreet：用于将HTML输出到页面。下面是所有这些标签的一个很好的参考：如果您也能解释一下您的代码，那将很有帮助。嗨，欢迎来到Stack Overflow！当你回答一个问题时，你应该包括一些解释，比如作者做错了什么，你做了什么来修复它。我告诉你这一点是因为你的答案被标记为低质量，目前正在审查中。你可以点击“编辑”按钮来选择答案。我同意尼克·卡恩的解决方案。我粘贴了自己的工作代码作为确认。