2017-05-25 214 views
2

我有一个表单,用户输入他的名字(必填),dob(不是必填项),在提交表单之前,有一个确认信息表明他/她是否确定不提交表单DOB。我使用的模式从那里提交上面的表格。我试图在下面运行我的代码,但我看不出问题为什么不能正常工作。当dob没有价值时,模态应该问并且说“没有dob可以继续吗?”如果用户点击提交按钮,那么它应该提交上面的模式以外的表格。我希望你们帮助我。谢谢。提交之前提交的JQuery模式

HTML

<form id="createexperience" class="intro-message" method="post" action="./createexperience.php" enctype="multipart/form-data"> 
    <div class="form-group label-floating is-empty"> 
     <input type="text" name="name" required data-msg-required="Please enter your name"> 
    </div> 
    <div class="form-group label-floating is-empty"> 
     <input type="text" id="namefield" name="dob"> 
    </div> 
    <div class="form-group margin18 padbtm30"> 
    <input type="submit" class="btn btn-primary" value="Submit" /> 
    </div> 
</form> 

<div id="portfoliomsgmodal" class="modal fade" tabindex="-1"> 
<div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h3 class="modal-title">TIP</h3> </div> 
     <div class="modal-body"> 
       <label>There are twice as much chances of you getting contacted by your customers if you upload something in your portfolio. Upload photos or video or audio links to your profile.</label> 
     </div> 
     <div class="modal-footer"> 
      <input type="submit" class="btn btn-warning" data-dismiss="modal" value="Now"> 
      <input type="submit" id="submitlater" class="btn btn-primary nomargin" value="Later"> 
     </div> 
    </div> 
</div> 
</div> 

jQuery的

$(document).bind("click", function (e) { 
    $("#createexperience").validate({ 
     rules: { 
      "language[]": { 
       required: !0 
      } 
     } 
     , messages: {} 
     , submitHandler: function() { 
      return !1 
     } 
     , ignore: ".ignore" 
     , errorElement: "label" 
     , errorClass: "has-error" 
     , submitHandler: function (e) { 
      if ($.trim($('#namefield').val()) == '') { 
       if (jQuery('#submitlater').data('clicked')) { 
        $('#createexperience').submit(); 
        e.submit(); 
       } 
       else { 
        $('#portfoliomsgmodal').modal('show'); 
        return false; 
       } 
      } 
      else { 
       e.submit(); 
      } 
     } 
     , highlight: function (e) { 
      $(e).closest(".form-group").removeClass("success").addClass("has-error") 
     } 
    }) 
}) 
+0

可以请您设置jsfiddle –

+0

您对此表单有什么期待? –

+0

@bRIMOs我想使用模式按钮提交表单(id =“createexperience”) – acmsohail

回答

2

submitHandler功能是错误的。试试这个代码,希望它的作品。

$(document).bind("click", function (e) { 
    $("#createexperience").validate({ 
     rules: { 
      "language[]": { 
       required: !0 
      } 
     } 
     , messages: {} 
     , submitHandler: function() { 
      return !1 
     } 
     , ignore: ".ignore" 
     , errorElement: "label" 
     , errorClass: "has-error" 
     , submitHandler: function (e) { 
      if ($.trim($('#namefield').val()) == '') { 
       $('#portfoliomsgmodal').modal('show'); 
       $('#submitlater').click(function() { 
        e.submit(); 
       }); 
      } else { 
      e.submit(); 
      } 
     } 
     , highlight: function (e) { 
      $(e).closest(".form-group").removeClass("success").addClass("has-error") 
     } 
    }) 
}); 
+0

非常感谢你,它完美的作品:) – acmsohail

+0

随时欢迎:) – user7152572