通过 Html.BeginForm 提交激活加载动画

我想在用户单击提交按钮时显示加载动画。简单的 gif 就可以完成工作。这是我的代码：

@using (Html.BeginForm("SData","Crawl"))
{
    <p>
        Enter Starting URL:<input class="txt" type="text" id="sUrl" name="sUrl" title="Enter Starting URL"/>
    </p>

    <p>
        Enter Number of Threads:<input class="txt" type="text" id="Nbt" name="Nbt" title="Enter number of threads"/>
    </p>

    <p>
        <input class="button" id="submit" type="submit" value="Submit" />
   </p>   
}

Edit

我错误地认为这个问题涉及 AJAX 助手。以下是使用 HtmlHelper 的方法。

首先，向表单添加一个 ID，以便您可以使用 JQuery 获取它：

@using (Html.BeginForm("SData", "Crawl", FormMethod.Post, new { id = "myform" }))
{
    // the form
}

接下来，添加一个 Javascript 事件处理程序来拦截表单提交并显示加载 GIF。

$("#myform").submit(function(e) {
    $("#myLoadingElement").show();
});

（原答案如下...）

Use the AjaxOptions http://msdn.microsoft.com/en-us/library/system.web.mvc.ajax.ajaxoptions%28v=vs.108%29.aspx类设置一个LoadingElementId，Ajax 帮助器将在等待服务器响应时显示该元素：

@using (Html.BeginForm("SData","Crawl", new AjaxOptions() {
    LoadingElementId="myLoadingElement"
}))
{
    // form
}

然后只需将 gif 放在您想要显示的任何位置（最初隐藏它）：

<div id="myLoadingElement" style="display: none;">
    <img src="loading.gif" alt="Loading..." />
</div>