如何使用modal在数据库中插入vales

Question

我有两个按钮， 登录和注册 。 如果我单击登录按钮，则应打开登录模式并注册按钮意味着应该打开注册模式。
我想要做的是，在打开注册模式后，我想验证表单并将值插入数据库。 但是当我点击register_submit时，什么也没发生。

 <!-- Admin Extension --> <script src="http://preview.oklerthemes.com/porto-admin/edge/assets/javascripts/theme.admin.extension.js"></script> <script src="http://preview.oklerthemes.com/porto-admin/edge/assets/vendor/jquery-validation/jquery.validate.js"></script> <script> $(document).ready(function(){ $('#register_submit').click(function(){ alert(); if($('#registerForm').valid()){ /*$.ajax({ url:'register_bussiness.php', type:'POST', data: $('form#registerForm').serialize(), success:function(data){ //var res=jQuery.parseJSON(data);// convert the json console.log(data); if(data == "Success"){ $('#btn-submit').prop('disabled', true); $("#bussiness_suc_alert").show(); $("#bussiness_suc_alert").fadeOut(2000); } }, });*/ return false; } }); }); </script> 

 <li><button class="btn btn-primary" data-toggle="modal" data-target="#registerModal">Register</button></li> <li style="margin-left: 10px;"><button class="btn btn-primary" data-toggle="modal" data-target="#loginModal">Login</button></li> <div class="container"> <div class="modal fade" id="loginModal" role="dialog"> <div class="modal-dialog" style="z-index: 9999;"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header" style="padding:5px 50px;"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4>Login</h4> </div> <div class="modal-body" style="padding:40px 50px;"> <form role="form"> <div class="form-group"> <label for="usrname">Username</label> <input type="text" class="form-control" id="usrname" placeholder="Enter Name"> </div> <div class="form-group"> <label for="psw"> Password</label> <input type="text" class="form-control" id="psw" placeholder="Enter password"> </div> <div class="checkbox"> <label><input type="checkbox" value="" checked>Remember me</label> </div><br> <button type="submit" class="btn btn-info btn-block">Login </button> </form> </div> </div> </div> </div> <!--###### Login From End #######---> </div> <div class="container"> <div class="modal fade" id="registerModal" tabindex="-1" role="dialog" aria-labelledby="smallModalLabel" aria-hidden="true"> <div class="modal-dialog" style="z-index: 9999;"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header" style="padding:5px 50px;"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4>Register</h4> </div> <div class="modal-body" style="padding:40px 50px;"> <form method="POST" id="registerForm" class="form-horizontal form-bordered"> <div class="form-group"> <label for="usrname"> Username</label> <input type="text" class="form-control" id="username" placeholder="Enter name"> </div> <div class="form-group"> <label for="email">Email</label> <input type="text" class="form-control" id="email" placeholder="Enter email"> </div> <div class="form-group"> <label for="psw">Password</label> <input type="text" class="form-control" id="psw" placeholder="Enter password"> </div> <div class="form-group"> <label for="psw"> Mobile</label> <input type="text" class="form-control" id="psw" placeholder="Mobile Number"> </div><br> <!--<button type="submit" class="btn btn-info btn-block">Submit</button>--> <input type="button" class="btn btn-info btn-block" id="register_submit" name="submit" value="INVITE QUOTES"> </form> </div> </div> </div> </div> </div><!-- /.container --> 

Answer 1

DEMO附件

  $("#submitRegister").on("click", function () { var errorCount = 0; $("#registerForm input").each(function (idx, li) { if ($(this).val() == "") { errorCount++ } }); if (errorCount > 0) { alert("Please fill up the form") return false; } else $("#registerForm").submit(); }); 

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <div class="container"> <!-- Trigger the modal with a button --> <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#login">login</button> <!-- Modal --> <div class="modal fade" id="login" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title">login</h4> </div> <div class="modal-body"> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div> <!-- Trigger the modal with a button --> <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#register">register</button> <!-- Modal --> <div class="modal fade" id="register" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title">Register </h4> </div> <form method="POST" id="registerForm" class="form-horizontal form-bordered"> <div class="modal-body"> <div class="form-group"> <label for="usrname"> Username</label> <input type="text" class="form-control" id="username" placeholder="Enter name"> </div> <div class="form-group"> <label for="email">Email</label> <input type="text" class="form-control" id="email" placeholder="Enter email"> </div> <div class="form-group"> <label for="psw">Password</label> <input type="text" class="form-control" id="psw" placeholder="Enter password"> </div> <div class="form-group"> <label for="psw"> Mobile</label> <input type="text" class="form-control" id="psw" placeholder="Mobile Number"> </div><br> </div> <div class="modal-footer"> <button type="button" id="submitRegister" class="btn btn-info btn-block">INVITE QUOTES</button> </div> </form> </div> </div> </div> </div>