当前位置: 首页 > 工具软件 > Parsley.js > 使用案例 >

Parsley.Js

花稳
2023-12-01

1.バリデートラプラグインのインポート

<script src="./asset/lib/parsley/parsley.js"></script>
<script src="./asset/lib/parsley/i18n/ja.js"></script>

2.バリデートから除外する要素の指定

	var $workForm = $('#work-form');	
	//バリデート
	var $parsleyWorkForm = $workForm.parsley(
		{	

			//excluded:"input[type=button], input[type=submit], input[type=reset], input[type=hidden], [disabled], div[data-trigger-switch-id]:hidden *",
			
			excluded: 'input[type=button], input[type=submit], input[type=reset]',
			//hiddenもバリデートに含めるように指定
			inputs: 'input, textarea, select, input[type=hidden], :hidden',	
				
			 classHandler: function (ParsleyField) {
				 //alert("classHandler");
			},
			 errorsContainer: function (ParsleyField) {
				 //alert("errorsContainer");		 	 
			}
		}
	);

3.グループ指定実行

	$(':radio[name=think]').change(function(){		
		$parsleyWorkForm.validate({group: 'answers'});
		$parsleyWorkForm.validate({group: "answers-validate"});		
	});
	
4.簡単なサンプル
	window.Parsley
		.addValidator('pairInput2', {
			requirementType: 'string',
			validateString: function(value, requirement) {				
				//alert("[カスタムバリデータ]answerAll" + value);				
				var result = true;				
				var inputName = requirement;
				var $input = $(':text[name="' + inputName + '"]');				
				var prevInputValue = $input.prev().prev().val();		
				//alert(prevInputValue);				
				if(prevInputValue == PAIR_INPUT_BLANK_STR && value != "") {
					result = false;
				}												
				return result;				
			},
			messages: {
				ja: '上記3の「考えたこと」の根拠を入力してから記入してください。',
				en: ''
			}
	});
5.フォーカス削除
<form id="work-form" action="" method="post" data-parsley-focus="none">
6.再入力サンプル

<input type="email" class="width-full"  id='mailaddress2' name="mailaddress2"  maxlength="80"  data-parsley-required="true"   >
<input type="email" class="width-full" maxlength="80" id='mailaddress2-confirm' data-parsley-equalto="[name='mailaddress2']" data-parsley-required="true">




 类似资料:

相关阅读

相关文章

相关问答