как проверить форму HTML5 и не публиковать форму?

0

У меня есть форма с некоторыми атрибутами html, такими как:

<form>
      <label>Full  Name</label>

      <input type="text" name="firstname" class="span3" required="required">
      <label>Email Address</label>
      <input type="email" name="email" class="span3" required="required">
      <label>Username</label>
      <input type="text" name="username" class="span3" required="required">
      <label>Password</label>

когда пользователь нажимает кнопку, я хочу, чтобы html5 применял правила validation.

Если правила проверки правильны, то не отправляйте форму, но используйте некоторый $ _POST ajax

Есть идеи?

Теги:

2 ответа

5
Лучший ответ

checkValidity() будет проверять форму, используя собственную проверку HTML5:

$('form').on('submit', function(e) { // or on button click ?
    e.preventDefault()

    var valid = e.target.checkValidity();

    if (valid) {
        // do ajax
    }
});

Из MDN:

В объектах HTMLFormElement метод checkValidity() возвращает true, если все элементы, связанные с элементом формы, которые подвержены проверке ограничений, удовлетворяют их ограничениям, а false, если таковые отсутствуют.

Обратите внимание, что он может не поддерживаться во всех браузерах.

0

Что-то вроде этого

$('form').on('submit', function(e) {
 if (e.target.checkValidity() === false)
 {
   e.preventDefault(); // disable the "normal" action of submit
 }
});

Ещё вопросы

Сообщество Overcoder
Наверх
Меню