Question

我有一个目前通过AJAX提交的表单，但是我想使用内联HTML5模式验证和所需的功能。

我如何实现这一目标并仍然通过AJAX提交？我在这里玩了一些其他的答案，但是我在很多表单上使用这个AJAX并在按钮中将数据传递给它。

我已经移动了简单的JS inline，以便更容易看到整个表单

http://leatherjacksofficial.com

Answer 1

HTML5验证仅在您的表单将被提交时才有效。如果您要序列化表单并通过ajax发送，则html5验证将永远不会发生。您可以随时调用checkValidity()表单方法来了解如果所有必需的输入都已填写

但是......

较新的浏览器现在已经实现了reportValidity()方法，您可以随时调用该方法进行验证以及显示错误的方法，即。就像用户按下提交按钮一样。这里只有一些旧浏览器不支持。您添加条件检查并使用（如果可用）

function submitForm(blah,blah)
{
    $yourForm = $('#formvmrp');

    if (typeof $yourForm[0].reportValidity === "function") { 
        if($yourForm.reportValidity())   // will evaluate to TRUE if all ok else FALSE and also show validation messages
        {
            // do ajax 
        }
    } else {
        if($yourForm[0].checkValidity()) // will evaluate to TRUE if all ok else FALSE but won't show validation messages
        { 
            // do ajax 
        }
        else {
                alert('please fill all the details');
       }
    }
}

HTML5模式，AJAX POST需要

1 个答案: