如何从Ajax表单中提交asp.net mvc中的下拉列表

Question

你如何从ajax表单中提交下拉列表"onchange"事件？

根据以下问题:如何在 html.BeginFrom中提交asp.net mvc中的下拉列表,您可以设置onchange ="this.form.submit"并更改下拉帖子.

但是,使用以下代码(在Ajax.BeginFrom中):

<% using (Ajax.BeginForm("UpdateForm", new AjaxOptions() { UpdateTargetId = "updateText" })) { %>
    <h2>Top Authors</h2>

    Sort by:&nbsp;<%=Html.DropDownList("sortByList", new SelectList(ViewData["SortOptions"], new { onchange = "this.form.submit()" })%>

    <%= Html.TextBox("updateText")%>
<% } %>

回发到控制器操作,但整个页面被替换为"updateText"文本的内容,而不是"updateText"文本框中的内容.

因此,不是仅替换Ajax.BeginForm中的区域,而是替换整个页面.

dropdownlist调用this.form.submit的正确方法是什么,只有Ajax.BeginForm中的区域？

Answer 1

好吧,差不多2年后,你可能已经不在乎了.谁知道:也许其他人(比如我;-)那样做.

所以这是(非常简单)的解决方案:

在你的Html.DropDownList(...)电话中,改变

new { onchange = "this.form.submit()" }

至

new { onchange = "this.form.onsubmit()" }

您看得出来差别吗？;-)

原因是Ajax.BeginForm()创建一个带有onsubmit()处理程序的表单以异步提交表单.通过调用submit(),您绕过此onsubmit()自定义处理程序.打电话onsubmit()给我工作.

Answer 2

在你的下拉列表替换

this.form.submit()

至

$(this.form).submit();

Answer 3

你可以尝试这样做（需要 jQuery）：

$("#yourDropdown").change(function() {
  var f = $("#yourForm");
  var action = f.attr("action");
  var serializedForm = f.serialize();
  $.post(action, serializedForm,
    function () { alert("Finished! Can do something here!") });
});