2016-01-12 3 views
-2

Я пытаюсь проверить регистрационную форму для загрузки и отправить на страницу PHP. Ниже приведен мой код jquery. Я новичок в JQuery так could't в состоянии сделать этоbootstrap modal registration form validate and submit

<script> 
    $(function() { 
//twitter bootstrap script 
     $("button#submit").click(function() { 
      $(document).ready(function() { 
       $('#register-form').formValidation({ 
        framework: 'bootstrap', 
        excluded: ':disabled', 
        icon: { 
         valid: 'glyphicon glyphicon-ok', 
         invalid: 'glyphicon glyphicon-remove', 
         validating: 'glyphicon glyphicon-refresh' 
        }, 
        fields: { 
         rfullname: { 
          validators: { 
           notEmpty: { 
            message: 'The username is required' 
           } 
          } 
         }, 
         rpassword: { 
          validators: { 
           notEmpty: { 
            message: 'The password is required' 
           } 
          } 
         } 
        } 
       }); 
      }); 

      $.ajax({ 
       type: "POST", 
       url: "process.php", 
       data: $('form#register-form').serialize(), 
       success: function (msg) { 
        //$("#thanks").html(msg) 
        $("#login-modal").modal('hide'); 
        bootbox.alert(msg); 
        $('#register-form').each(function() { 
         this.reset(); 
        }); 
       }, 
       error: function() { 
        alert("failure"); 
       } 
      }); 
     }); 
    }); 
</script> 

и форма регистрации

<form id="register-form" style="display:none;" data-async method="post" role="form"> 
    <div class="modal-body"> 
     <input id="rfullname" class="form-control" name="mname" type="text" placeholder="Your Full Name"> 
     <input id="remail" class="form-control" name="email" type="text" placeholder="E-Mail"> 
     <input id="rpassword" class="form-control" name="password" type="password" placeholder="Password"> 
    </div> 
    <div class="modal-footer"> 
     <div> 
     <button type="submit" name="submit" id="submit" class="btn btn-primary btn-lg btn-block">Register</button> 
     </div> 
     <div> 
     <button id="register_login_btn" type="button" class="btn btn-link">Log In</button> 
     <button id="register_lost_btn" type="button" class="btn btn-link">Lost Password?</button> 
     </div> 
    </div> 
</form> 

эта форма должна представить значения после проверки.

+0

Получение каких-либо ошибок ?? – Aatman

+0

Почему document.ready внутри кнопки click event handler? какой плагин вы используете для проверки вашей формы? –

+0

да документ готов в неправильном месте – Aatman

ответ

0

Попробуйте это.

<script> 
      $(document).ready(function() { 
        $('#register-form').formValidation({ 
         framework: 'bootstrap', 
         excluded: ':disabled', 
         icon: { 
          valid: 'glyphicon glyphicon-ok', 
          invalid: 'glyphicon glyphicon-remove', 
          validating: 'glyphicon glyphicon-refresh' 
         }, 
        fields: { 
         rfullname: { 
          validators: { 
           notEmpty: { 
            message: 'The username is required' 
           } 
          } 
         }, 
         rpassword: { 
          validators: { 
           notEmpty: { 
            message: 'The password is required' 
           } 
          } 
         } 
        }, 
        submitHandler : function(validator, form, submitButton) { 
             saveData(); 
            } 
       }); 
      }); 

       function saveData(){ 
         $.ajax({ 
          type: "POST", 
         url: "process.php", 
         data: $('form#register-form').serialize(), 
          success: function(msg){ 
            //$("#thanks").html(msg) 
           $("#login-modal").modal('hide'); 
           bootbox.alert(msg); 
           $('#register-form').each(function(){ 
           this.reset(); 
           });  
          }, 
         error: function(){ 
          alert("failure"); 
          } 
          }); 
       } 
    </script> 
+0

Не могли бы вы быть более ясными в том, что вы сделали, почему и так далее? –

+0

примечание бывает не работает –

0

я нашел ответ на мой вопрос

<script> 
$(function() { 

    $('form[name="registor"]').find('input,select,textarea').not('[type=submit]').jqBootstrapValidation({ 

    submitSuccess: function ($form, event) { 

     $.ajax({ 
       type: "POST", 
      url: "process.php", 
      data: $('form#register-form').serialize(), 
       success: function(msg){ 
      // just to confirm ajax submission 
      $("#login-modal").modal('hide'); 
        bootbox.alert(msg); 
        $('#register-form').each(function(){ 
        this.reset(); 
        });}, 
      error: function(){ 
       alert("failure"); 
       } 
       }); 

     // will not trigger the default submission in favor of the ajax function 
     event.preventDefault(); 
    } 

    }); 

}); 
</script> 

спасибо всем, кто пытается мне помочь.

+0

нет ни одного голоса пожалуйста –

Смежные вопросы