Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][JavaScript]Walidacja formularza w bootstrapie, a ajax
Forum PHP.pl > Forum > Przedszkole
emeres1
witam,
chciałbym obsłużyć formularz do wysyłania maili z pomocą ajaxa zachowując walidację formularza dzięki ' class="form-control" '. Gdy używam 'button" formularz wykonuje akcję i przeładowywuje stronę, a gdy z kolei chciałbym zastąpić 'button" jakimś innym przyciskiem np. divem z funkcją js tracę możliwość walidacji dzięki ' class="form-control" '. Macie może jakiś pomysł jak połączyć te dwie rzeczy?

  1. <form id="contact" role="form">
  2. <div class="col-md-6">
  3. <fieldset>
  4. <input name="name" type="text" class="form-control" id="name" placeholder="Imię i nazwisko..." required="">
  5. </fieldset>
  6. </div>
  7. <div class="col-md-6">
  8. <fieldset>
  9. <input name="email" type="email" class="form-control" id="email" placeholder="E-mail..." required="">
  10. </fieldset>
  11. </div>
  12. <div class="col-md-12">
  13. <fieldset>
  14. <textarea name="message" rows="6" class="form-control" id="message" placeholder="Treść..." required=""></textarea>
  15. </fieldset>
  16. </div>
  17. <div class="col-md-12">
  18. <fieldset>
  19. <button id="form-submit" class="btn">Wyślij wiadomość</button>
  20. </fieldset>
  21. </div>
  22. </form>


pozdrawiam
emeres1
Faktycznie zablokowało przeładowanie strony, ale pozbawiło funkcji validacji "class="form-control".
  1. $('#form-submit').click(function(event){
  2. event.preventDefault();
  3. var $name = $('#name').val(),
  4. $email = $('#email').val(),
  5. $message = $('#message').val();
  6.  
  7.  
  8. $.ajax({
  9. type: "POST",
  10. url: 'mail.php',
  11. data: {
  12. name: $name,
  13. email: $email,
  14. message: $message
  15.  
  16. },
  17. cache: false,
  18. async: true,
  19. beforeSend: function(XMLHttpRequest) {
  20.  
  21.  
  22. },
  23. success: function(value) {
  24.  
  25. },
  26. error: function() {
  27. }
  28.  
  29. });
  30.  
  31. })
viking
A gdzie masz niby tą walidację?
tenloginjestzajety
Nie trzeba tworzyć walidacji poprzez onsubmit w form, można blokować button w formularzu czystym js, warunek czy dany input jest pusty.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.