imuiValidationRule
| コンポーネント情報 | |
|---|---|
| モジュール | im_ui |
| 導入されたバージョン | 8.0.0 |
| バージョン | 8.0.0 |
機能説明
- JSSP Validator で定義したバリデーションルール、メッセージをクライアントサイドに出力します。
属性一覧
| 注釈 | 属性名 | 型 | 説明 | 省略時の動作 |
|---|---|---|---|---|
|
必須
|
messagesName |
string | バリデーションメッセージオブジェクトの名前です | - |
|
必須
|
rule |
string | バリデーションルールのパスと変数名です | - |
|
必須
|
rulesName |
string | バリデーションルールオブジェクトの名前です | - |
サンプル
サンプル
- validator.jsで作成したルールを使い、クライアントサイドで必須チェックをします。
サーバサイド JavaScript(sample.js)
// sample.js
/**
* @param request リクエストパラメータ
* @validate validator#init
*/
function init(request) {
}
サーバサイド JavaScript(validator.js)
// validator.js
var init = {
'name': {
caption: "氏名",
required: true
}
};
HTML(sample.html)
<imart type="head">
<script src="ui/libs/jquery-validation-1.9.0/jquery.validate.js"></script>
<imart type="imuiValidationRule" rule="/jssp/sample/validators/validator#init" rulesName="rules" messagesName="messages" />
</imart>
<div id="container" class="imui-form-container-wide">
<form id="myform" method="POST">
<input type="text" name="name" />
<imart type="imuiButton" id="submit-button" value="送信" class="imui-small-button" />
</form>
</div>
<script type="text/javascript">
$(function() {
imuiDisableOnSubmit('#myform');
$('#submit-button').click(function() {
if (imuiValidate('#myform', rules, messages)) {
imuiConfirm('メッセージ', '確認', function() {
imuiAjaxSend('#myform', 'POST', 'json');
});
}
});
});
</script>