いくつかのボタンがあるフォームがあり、 http://jquery.bassistance.de/validate/ のjQuery Validationプラグインを使用しています。 javascriptコードのどこからでもjquery検証プラグインによってフォームが有効な状態にあるかどうかを確認できる方法があるかどうかを知りたいだけです。
.valid()
を使用します。
$("#form_id").valid();
選択したフォームが有効かどうか、または選択したすべての要素が有効かどうかを確認します。このメソッドを使用してチェックする前に、フォームでvalidate()を呼び出す必要があります。
id='form_id'
のあるフォームは、すでに.validate()
が呼び出されているフォームです。
2015 answer:最新のブラウザではこれをそのまま使用できます。jQueryの HTML5 CheckValidity API を使用してください。また、これを行うために jquery-html5-validity module を作成しました。
npm install jquery-html5-validity
次に:
var $ = require('jquery')
require("jquery-html5-validity")($);
次に実行できます:
$('.some-class').isValid()
true
@mikemaccanaの回答は便利です。
また、 https://github.com/ryanseddon/H5F も使用しました。 http://microjs.com にあります。それはある種のポリフィルであり、次のように使用できます(例ではjQueryが使用されます)。
if ( $('form')[0].checkValidity() ) {
// the form is valid
}
valid()メソッド。
iContribute:正しい答えを出すのに遅すぎることはありません。
var form = $("form#myForm");
if($('form#myForm > :input[required]:visible').val() != ""){
form.submit();
}else{
console.log("Required field missing.");
}
このようにして、「必須」フィールドの基本的なHTML5検証は、フォームの「名前」値を使用した標準送信を妨げることなく行われます。
入力のグループについては、@ mikemaccanaの答えに基づいた改良版を使用できます
$.fn.isValid = function(){
var validate = true;
this.each(function(){
if(this.checkValidity()==false){
validate = false;
}
});
};
これを使用して、フォームが有効かどうかを確認できます。
if(!$(".form-control").isValid){
return;
}
同じ手法を使用して、すべてのエラーメッセージを取得できます。
$.fn.getVelidationMessage = function(){
var message = "";
var name = "";
this.each(function(){
if(this.checkValidity()==false){
name = ($( "label[for=" + this.id + "] ").html() || this.placeholder || this.name || this.id);
message = message + name +":"+ (this.validationMessage || 'Invalid value.')+"\n<br>";
}
})
return message;
}
Magentoの場合、次のような方法でフォームの検証を確認します。
これを試すことができます:
require(["jquery"], function ($) {
$(document).ready(function () {
$('#my-button-name').click(function () { // The button type should be "button" and not submit
if ($('#form-name').valid()) {
alert("Validation pass");
return false;
}else{
alert("Validation failed");
return false;
}
});
});
});
これがお役に立てば幸いです!