我如何提交表单并同时弹出警报？

Question

（我正在使用 ASP.NET、MVC 4、C#、Bootstrap、Javascript。）

我有一个上传文件的表格（多个），效果很好，这是表格：

            @using (Html.BeginForm("Index", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
        {
            <table>
                <tr>
                    <td>Choose a filter:</td>
                    <td style="margin-bottom:auto">
                        @Html.DropDownList("filterProfile", (SelectList)ViewBag.FilterList)
                    </td>
                </tr>
                <tr>
                    <td>File:</td>
                    <td><input type="file" name="Files" id="Files" multiple /></td>
                </tr>

                <tr>
                    <td>&nbsp;</td>
                    <td><input type="submit" name="submit" value="Filter" /></td>
                </tr>
            </table>

        }

因为上传文件可能需要一点时间，我认为弹出警告说我们正在处理您的文件会很好，所以我在提交按钮中添加了一个 ID，如下所示：

 <tr>
                    <td>&nbsp;</td>
                    <td><input type="submit" name="submit" id="alertMe" value="Filter" /></td>
                </tr>
            </table>

如您所见，ID 是“alertMe”。

然后我在 JS 文件中写了这段代码：

$(function () {
$('#alertMe').click(function (e) {

    e.preventDefault();

    $('#processAlert').slideDown();
});

});

在我的视图（HTML）中这个部分的冷藏箱：

<div class="alert alert-info alert-dismissable" id="processAlert">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true" id="processAlert">&times;</button>
<strong>Processing...</strong> Upload files and Processing your request.

但现在它只显示警报而不提交文件，如果我取消提交按钮的 ID 属性，它的效果很好......我怎样才能让提交按钮触发两个事件？

一个事件是显示处理文件的警报。 另一个事件是将文件发布到控制器中的方法。

我该怎么做？如果可能的话……

我最终会做什么：（IMoses 回答）

我只是从脚本中删除“preventDefault”。

Answer 1

问题是阻止默认的调用会阻止表单提交。因此，添加提交表单的调用将解决此问题。

$(function () {
$('#alertMe').click(function (e) {
   e.preventDefault();
   $('#processAlert').slideDown();
   $('form:first').submit();
});