Asp.Net HtmlBeginForm() Jquery 提交无效

Question

我想在提交表单后使用 Ajax 显示部分视图。我需要监听提交事件，然后触发 Ajax 以显示部分视图。注意：我不需要使用 JQuery 或 Ajax 提交表单，我只需要捕获该事件并触发 Ajax.

但是，JQuery 函数 $("form").submit() 不起作用！

我在 Chrome 调试器中放置了一个断点，它甚至没有被触发。问题是什么？这是代码：

P.S。该表单由组合框组成，用户可以在其中 select 应用程序名称和版本，然后性能测试结果图表将使用 Ajax.

显示为部分视图

@model PerformanceDashboard.Models.ApplicationDashboardViewModel

<h3>Per Application</h3>


<br />

@using (Html.BeginForm("Index", "Home", FormMethod.Post, new { id = "form" }))
{ 
   // @Html.AntiForgeryToken()
                            
    <div class="selector-label">
            @Html.LabelFor(model => model.ApplicationNames)
    </div>

    <div class="selector-combobox">
        @Html.DropDownListFor(x => x.SelectedApplication, Model.ApplicationNames)
        @Html.ValidationMessageFor(x => x.SelectedApplication)   
     </div>

    <br />
    
    <div class="selector-label">
        @Html.LabelFor(model => model.TestingTypes)
    </div>

    <div class="selector-combobox">
        @Html.DropDownListFor(x => x.SelectedTestingType, Model.TestingTypes)
        @Html.ValidationMessageFor(x => x.SelectedTestingType)
    </div>

    <br />
    
    <div class="selector-label">
        @Html.Label("Range")
    </div>

    <div class="selector-combobox">
        @Html.DropDownListFor(x => x.SelectedFirstVersion, Model.FirstVersion)
        @Html.ValidationMessageFor(x => x.SelectedFirstVersion)
        &nbsp;
        @Html.DropDownListFor(x => x.SelectedSecondVersion, Model.SecondVersion)
        @Html.ValidationMessageFor(x => x.SelectedSecondVersion)
    </div>
    
    <br />
    
    <input type="submit" value="Generate" />
    
}

<div id="displayarea">

</div>


<script>

    $(function () {

        $("#form").submit(function (e) {

            e.preventDefault();
            alert("form submitted!");

            $.ajax({
                type: this.method, //'POST'
                url: this.action, //'/controller/index'
                dataType: 'html',
                success: function (result) {
                    $('#displayarea').html(result);
                }
            });
        })
    });

</script>

Answer 1

我的天啊！！问题是我没有在 HTML 中引用 JQuery！这条线解决了我的问题：

<script src="~/Scripts/jquery-1.10.2.js"></script>

谢谢！

Asp.Net HtmlBeginForm() Jquery 提交无效

Asp.Net HtmlBeginForm() Jquery submit does not work

forms

jquery

asp.net-ajax

http-post