Question

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

然而，JQuery函数$（＆＃34; form＆＃34;）。submit（）不起作用！

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

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

＆＃13;

@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>

＆＃13;

Answer 1

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

＆＃13;

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

＆＃13;

谢谢！

Asp.Net HtmlBeginForm（）Jquery提交不起作用

1 个答案: