如果使用jquery生成表单，则触发模式

我有一个问题，当提交表单时，它应该在有效时触发模态，如果它无效，它应该触发validation脚本。 我试过在论坛中寻找答案，并遇到了一个类似于我的问题 。 但不幸的是，模态仍然没有弹出。

我想要发生的是当用户点击提交按钮时，将运行validation，如果所有数据都有效，它将触发模式弹出，如果无效，则validation将像这里一样发生。

模型

public class Reg { [Required(ErrorMessage = "Please enter first name")] public string Firstname { get; set; } [Required(ErrorMessage = "Please enter MiddleInitial")] public string MiddleInitial { get; set; } [Required(ErrorMessage = "Please enter Surname")] public string Surname { get; set; } } 

CONTROLLER

  public ActionResult Index() { return View(); } [HttpPost] public ActionResult Index(Reg reg) { return View(); } 

视图

 @model WebApplication1.Models.Reg 
 @using (Html.BeginForm()) { @Html.AntiForgeryToken() 
 
 @Html.LabelFor(model => model.Firstname, htmlAttributes: new { @class = "control-label" }) @Html.EditorFor(model => model.Firstname, new { htmlAttributes = new { @class = "form-control", placeholder = @Html.DisplayNameFor(m => m.Firstname) } }) @Html.ValidationMessageFor(model => model.Firstname, "", new { @class = "text-danger" }) 
 
 @Html.LabelFor(model => model.MiddleInitial, htmlAttributes: new { @class = "control-label" }) @Html.EditorFor(model => model.MiddleInitial, new { htmlAttributes = new { @class = "form-control", placeholder = @Html.DisplayNameFor(m => m.MiddleInitial) } }) @Html.ValidationMessageFor(model => model.MiddleInitial, "", new { @class = "text-danger" }) 
 
 @Html.LabelFor(model => model.Surname, htmlAttributes: new { @class = "control-label" }) @Html.EditorFor(model => model.Surname, new { htmlAttributes = new { @class = "form-control", placeholder = @Html.DisplayNameFor(m => m.Surname) } }) @Html.ValidationMessageFor(model => model.Surname, "", new { @class = "text-danger" }) 
 
  
 
 } 
 
 
 
 
 Confirm Submit × 
 
 @Html.Partial("CedulaPartial") Cancel  
 
 
  

JQUERY

  $('form').submit(function () { if ($(this).valid()) { $('#modals').modal('show'); } }); 

我也试过了

 $('#myModal').modal("show"); $('#myModal').dialog('open'); $('#myModal').modal(); $('#myModal').show(); $('#myModal').modal('toggle'); 

但仍然没有运气。

提前致谢。

Answer 1

UPDATE

修改脚本后，会发生无法单击表单的情况。 我认为模态被触发但没有显示模态。 这是输出：

http://sofzh.miximages.com/javascript/giphy.gif

直到我遇到这个 ，我尝试在课堂上删除fade命令，现在模态正在显示。 我目前正在使用Bootstrap v3.0.0，而fade命令在这里有一个bug。 谢谢你们的支持！