У меня есть форма с некоторыми атрибутами 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
Есть идеи?
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, если таковые отсутствуют.
Обратите внимание, что он может не поддерживаться во всех браузерах.
Что-то вроде этого
$('form').on('submit', function(e) {
if (e.target.checkValidity() === false)
{
e.preventDefault(); // disable the "normal" action of submit
}
});