javascript - MVC使用jquery代替提交按钮

Question

在我的页面上有一个这样的部分:

using (Html.BeginForm("AddSubTor", "Maintor", FormMethod.Post, htmlAttributes: new { ID = "frmSubTors" }))
{
  @Html.AntiForgeryToken()

  @Html.Partial("_SublistPartial")

  <div class="row" style="margin-top: 15px;">
    <div class="col-sm-12 col-md-12 col-lg-12 text-center ">
      @* submit button here *@
      <input type="submit" class="btn btn-default" value="Add"  />
    </div>
  </div>
  @Html.ValidationSummary(true, "", new { @class = "text-danger" })
}

我不使用提交按钮，而是用看起来像按钮的图像替换它，我也可以在 jquery 函数中执行相同的提交吗？就像那个类似按钮的图像的点击事件一样？我提交的数据还会提交吗？

我想这样做的原因是在部分中我有两个单选按钮。在两者上我都有一些用于检索数据和其他内容的 Jquery 代码。

如果我使用简单的提交按钮，我可以设置单选按钮，但没有单击事件，因此不会检索数据并且其他操作也不会完成。 因此，如果我可以使用 Jquery，那么我可以简单地调用单选按钮单击事件调用的函数，从而获取我的数据。

[编辑] 我正在寻找这样的东西:

$.Ajax({
  url: 'controller/action',
  type: 'POST',
  success: function(data) {
    $('#frmSubTors').html(data);
  }
}).done(function() {
  // do my other stuff here
});

这也行吗？

Answer 1

是的，您可以使用 jQuery 在单击图像时提交表单。 将提交按钮替换为图像并为其指定一个 id。

<div class="col-sm-12 col-md-12 col-lg-12 text-center ">
      @* submit button here *@
      <img id="myImage" src="blah.jpg" />
</div>

然后让 jQuery 响应点击事件:

$(document).ready(function() {
    $("#myImage").click(function() {
        $("#frmSubTors").submit();
    }
}

更多 jQuery 点击事件信息:http://www.w3schools.com/jquery/event_click.asp