2015-09-30 3 views
0

У меня проблема при попытке отправить форму, которая использует bootstrapValidator() для проверки полей -> она не отправляется, файл php не выполняется (я знаю это, потому что я пробовал без booststrapValidator и работает). Любая идея?Подача формы заблокирована bootstrapValidator

форма выглядит следующим образом:

<form id="contactForm" class="form-horizontal" role="form" action="contact_form.php" method="post"> 
     <div class="form-group"> 
     <label class="control-label col-sm-2" for="name">Name</label> 
     <div class="col-sm-10"> 
      <input type="text" class="form-control" id="name" name="name" placeholder="Name"> 
     </div> 
     </div> 
     <div class="form-group"> 
     <label class="control-label col-sm-2" for="email">Email</label> 
     <div class="col-sm-10"> 
      <input type="email" class="form-control" id="email" name="email" placeholder="[email protected]"> 
     </div> 
     </div> 
     <div class="form-group"> 
     <label class="control-label col-sm-2" for="msg">Mesage</label> 
     <div class="col-sm-10"> 
      <textarea class="form-control col-sm-10" id="msg" name="msg" placeholder=""></textarea> 
     </div> 
     </div> 
     <div class="form-group"> 
     <label id="captchaOperation" class="control-label col-sm-2" for="captcha"></label> 
     <div class="col-sm-10"> 
      <input type="text" class="form-control" id="captcha" name="captcha" placeholder="Answer"> 
     </div> 
     </div> 
     <div class="form-group"> 
     <div class="col-sm-offset-2 col-sm-10"> 
      <input type="submit" class="btn btn-primary" id="submit" name="submit" value="Send"></button> 
     </div> 
     </div> 
</form> 
+0

'' remove' 'это ненужно, но это не будет иметь никакого значения , post poststrap validator code too – Shehary

ответ

0

удалить из id="submit" name="submit" и </button> из

<input type="submit" class="btn btn-primary" id="submit" name="submit" value="Send"></button> 

добавить data-toggle="validator" в <form>

<form id="contactForm" class="form-horizontal" role="form" action="contact_form.php" method="POST" data-toggle="validator"> 

так законченном виде будет

<form id="contactForm" class="form-horizontal" role="form" action="contact_form.php" method="POST" data-toggle="validator"> 
    <div class="form-group"> 
     <label class="control-label col-sm-2" for="name">Name</label> 
     <div class="col-sm-10"> 
      <input type="text" class="form-control" id="name" name="name" placeholder="Name"> 
     </div> 
    </div> 
    <div class="form-group"> 
     <label class="control-label col-sm-2" for="email">Email</label> 
     <div class="col-sm-10"> 
      <input type="email" class="form-control" id="email" name="email" placeholder="[email protected]"> 
     </div> 
    </div> 
    <div class="form-group"> 
     <label class="control-label col-sm-2" for="msg">Mesage</label> 
     <div class="col-sm-10"> 
      <textarea class="form-control col-sm-10" id="msg" name="msg" placeholder=""></textarea> 
     </div> 
    </div> 
    <div class="form-group"> 
     <label id="captchaOperation" class="control-label col-sm-2" for="captcha"></label> 
     <div class="col-sm-10"> 
      <input type="text" class="form-control" id="captcha" name="captcha" placeholder="Answer"> 
     </div> 
    </div> 
    <div class="form-group"> 
     <div class="col-sm-offset-2 col-sm-10"> 
      <input type="submit" class="btn btn-primary" value="Send"> 
      </button> 
     </div> 
    </div> 
</form> 

и самозагрузки код валидатор пример

$(document).ready(function(){ 
    $('#contactForm').bootstrapValidator({ 
     icon: { 
      valid: 'glyphicon glyphicon-ok', 
      invalid: 'glyphicon glyphicon-remove', 
      validating: 'glyphicon glyphicon-refresh' 
     }, 
     excluded: [':disabled'], 
     fields: { 
      name: { 
       validators: { 
        notEmpty: { 
         message: 'The Full Name field is required' 
        } 
       } 
      }, 
      email: { 
       validators: { 
        notEmpty: { 
         message: 'The Email field is required' 
        } 
       } 
      }, 
      msg: { 
       validators: { 
        notEmpty: { 
         message: 'The Message field is required' 
        } 
       } 
      }, 
      captcha: { 
       validators: { 
        notEmpty: { 
         message: 'The Captcha field is required' 
        } 
       } 
      } 
     } 
    }); 
}); 

и представит форму после проверки, фактическая форма причины не подавать после проверки является id="submit" name="submit" внутри submit кнопки, где тип также type="submit" (Fiddle with name & id = submit) причина неизвестна, почему bootstrapvalidator не отправляет форму, возможно, ошибка может быть запутана, что делать с вводом, где type="submit" id="submit" name="submit" поэтому либо удалите id="submit" name="submit" (Fiddle without name & id = submit), либо измените что-то другое, чем type="submit" как id="sub" name="sub" (Fiddle with name & id = sub)

+0

Да, это сработало. Спасибо!! – sTx

0

идентификатор и имя «представить» были одна из проблем, еще один был такой:

$("#contactForm").submit(function(ev){ 
ev.preventDefault(); 
}); 
$("#sbm").on("click", function(){ 
var bootstrapValidator = $("#contactForm").data('bootstrapValidator'); 
bootstrapValidator.validate(); 

if(bootstrapValidator.isValid()) 
    //setTimeout(function(){$("#success").show();}, 300); 
    error = true; 
    $("#contactForm").submit(); 
else return; 
}); 

Я пытался захватить возвращенное состояние валидатора и предотвратить форму от представления. PS: Я пробовал без preventDefault() тоже, но без успеха, поэтому я удалил весь этот код, и теперь он работает нормально.

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

  • Нет связанных вопросов^_^