mirror of
https://github.com/yiisoft/yii2.git
synced 2025-11-02 13:02:24 +08:00
ja translation updates and encoding fix (#15960) [skip ci]
This commit is contained in:
Nobuo Kihara
committed by
Alexander Makarov
Alexander Makarov
parent
a3129c57ec
commit
cdf1b6562a
@ -1,151 +1,151 @@
|
||||
<EFBFBD>N<EFBFBD><EFBFBD><EFBFBD>C<EFBFBD>A<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>T<EFBFBD>C<EFBFBD>h<EFBFBD><EFBFBD> ActiveForm <EFBFBD><EFBFBD><EFBFBD>g<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
|
||||
クライアントサイドで ActiveForm を拡張する
|
||||
==========================================
|
||||
|
||||
[[yii\widgets\ActiveForm]] <EFBFBD>E<EFBFBD>B<EFBFBD>W<EFBFBD>F<EFBFBD>b<EFBFBD>g<EFBFBD>́A<EFBFBD>N<EFBFBD><EFBFBD><EFBFBD>C<EFBFBD>A<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>o<EFBFBD><EFBFBD><EFBFBD>f<EFBFBD>[<EFBFBD>V<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>̂<EFBFBD><EFBFBD>߂Ɏg<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>A<EFBFBD><EFBFBD> JavaScript <20><><EFBFBD>\<5C>b<EFBFBD>h<EFBFBD><68><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>Ă<EFBFBD><C482>܂<EFBFBD><DC82>B
|
||||
<EFBFBD><EFBFBD><EFBFBD>̎<EFBFBD><EFBFBD><EFBFBD><EFBFBD>͔<EFBFBD><EFBFBD><EFBFBD><EFBFBD>ɏ_<EFBFBD><EFBFBD><EFBFBD>ŁA<EFBFBD>l<EFBFBD>X<EFBFBD>ȕ<EFBFBD><EFBFBD>@<40>Ŋg<C58A><67><EFBFBD><EFBFBD><EFBFBD>邱<EFBFBD>Ƃ<EFBFBD><C682>\<5C>ɂȂ<C982><C882>Ă<EFBFBD><C482>܂<EFBFBD><DC82>B
|
||||
<EFBFBD><EFBFBD><EFBFBD>L<EFBFBD>ł<EFBFBD><EFBFBD><EFBFBD><EFBFBD>ɂ<EFBFBD><EFBFBD>ĉ<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><EFBFBD>B
|
||||
[[yii\widgets\ActiveForm]] ウィジェットは、クライアントバリデーションのために使う一連の JavaScript メソッドを備えています。
|
||||
その実装は非常に柔軟で、様々な方法で拡張することが可能になっています。
|
||||
下記でそれについて解説します。
|
||||
|
||||
## ActiveForm <EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g
|
||||
## ActiveForm イベント
|
||||
|
||||
ActiveForm <EFBFBD>́A<EFBFBD><EFBFBD><EFBFBD>A<EFBFBD>̐<EFBFBD><EFBFBD>p<EFBFBD>̃C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><EFBFBD>B
|
||||
<EFBFBD><EFBFBD><EFBFBD>̂悤<EFBFBD>ȃR<EFBFBD>[<5B>h<EFBFBD><68><EFBFBD>g<EFBFBD><67><EFBFBD>āA<C481><41><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>̃C<CC83>x<EFBFBD><78><EFBFBD>g<EFBFBD><67><EFBFBD>w<EFBFBD>ǂ<EFBFBD><C782>ď<EFBFBD><C48F><EFBFBD><EFBFBD><EFBFBD><EFBFBD>邱<EFBFBD>Ƃ<EFBFBD><C682>o<EFBFBD><6F><EFBFBD>܂<EFBFBD><DC82>B
|
||||
ActiveForm は、一連の専用のイベントを発生させます。
|
||||
次のようなコードを使って、これらのイベントを購読して処理することが出来ます。
|
||||
|
||||
```javascript
|
||||
$('#contact-form').on('beforeSubmit', function (e) {
|
||||
if (!confirm("<22>S<EFBFBD>ăI<C483>[<5B>P<EFBFBD>[<5B>B<EFBFBD><42><EFBFBD>M<EFBFBD><4D><EFBFBD>܂<EFBFBD><DC82><EFBFBD>?")) {
|
||||
if (!confirm("全てオーケー。送信しますか?")) {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
});
|
||||
```
|
||||
|
||||
<EFBFBD>ȉ<EFBFBD><EFBFBD>A<EFBFBD><EFBFBD><EFBFBD>p<EFBFBD>ł<EFBFBD><EFBFBD><EFBFBD><EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>Ă<EFBFBD><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><EFBFBD>傤<EFBFBD>B
|
||||
以下、利用できるイベントを見ていきましょう。
|
||||
|
||||
### `beforeValidate`
|
||||
|
||||
`beforeValidate` <20>́A<CD81>t<EFBFBD>H<EFBFBD>[<5B><><EFBFBD>S<EFBFBD>̂<EFBFBD><CC82><EFBFBD><EFBFBD><EFBFBD><D882><EFBFBD><EFBFBD>O<EFBFBD>Ƀg<C983><67><EFBFBD>K<EFBFBD>[<5B><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
`beforeValidate` は、フォーム全体を検証する前にトリガーされます。
|
||||
|
||||
<EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>n<EFBFBD><EFBFBD><EFBFBD>h<EFBFBD><EFBFBD><EFBFBD>̃V<EFBFBD>O<EFBFBD>j<EFBFBD>`<60><><EFBFBD>͈ȉ<CD88><C889>̒ʂ<CC92>:
|
||||
イベントハンドラのシグニチャは以下の通り:
|
||||
|
||||
```javascript
|
||||
function (event, messages, deferreds)
|
||||
```
|
||||
|
||||
<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>͈ȉ<EFBFBD><EFBFBD>̒ʂ<EFBFBD>:
|
||||
引数は以下の通り:
|
||||
|
||||
- `event`: <EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>̃I<EFBFBD>u<EFBFBD>W<EFBFBD>F<EFBFBD>N<EFBFBD>g<EFBFBD>B
|
||||
- `messages`: <EFBFBD>A<EFBFBD>z<EFBFBD>z<EFBFBD><EFBFBD><EFBFBD>ŁA<EFBFBD>L<EFBFBD>[<5B>͑<EFBFBD><CD91><EFBFBD><EFBFBD><EFBFBD> ID<49>A<EFBFBD>l<EFBFBD>͑Ή<CD91><CE89><EFBFBD><EFBFBD>鑮<EFBFBD><E991AE><EFBFBD>̃G<CC83><47><EFBFBD>[<5B><><EFBFBD>b<EFBFBD>Z<EFBFBD>[<5B>W<EFBFBD>̔z<CC94><7A><EFBFBD>ł<EFBFBD><C582>B
|
||||
- `deferreds`: Deferred <EFBFBD>I<EFBFBD>u<EFBFBD>W<EFBFBD>F<EFBFBD>N<EFBFBD>g<EFBFBD>̔z<EFBFBD><EFBFBD><EFBFBD>B`deferreds.add(callback)` <20><><EFBFBD>g<EFBFBD><67><EFBFBD>āA<C481>V<EFBFBD><56><EFBFBD><EFBFBD> deferrd <20>Ȍ<EFBFBD><C88C><EFBFBD><D882>lj<EFBFBD><C789><EFBFBD><EFBFBD>邱<EFBFBD>Ƃ<EFBFBD><C682>o<EFBFBD><6F><EFBFBD>܂<EFBFBD><DC82>B
|
||||
- `event`: イベントのオブジェクト。
|
||||
- `messages`: 連想配列で、キーは属性の ID、値は対応する属性のエラーメッセージの配列です。
|
||||
- `deferreds`: Deferred オブジェクトの配列。`deferreds.add(callback)` を使って、新しい deferrd な検証を追加することが出来ます。
|
||||
|
||||
<EFBFBD>n<EFBFBD><EFBFBD><EFBFBD>h<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>^<5E>U<EFBFBD>l `false` <20><><EFBFBD>Ԃ<EFBFBD><D482>ƁA<C681><41><EFBFBD>̃C<CC83>x<EFBFBD><78><EFBFBD>g<EFBFBD>ɑ<EFBFBD><C991><EFBFBD><EFBFBD>t<EFBFBD>H<EFBFBD>[<5B><><EFBFBD>̌<EFBFBD><CC8C>͒<D882><CD92>~<7E><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
<EFBFBD><EFBFBD><EFBFBD>̌<EFBFBD><EFBFBD>ʁA`afterValidate` <20>C<EFBFBD>x<EFBFBD><78><EFBFBD>g<EFBFBD><67><EFBFBD>g<EFBFBD><67><EFBFBD>K<EFBFBD>[<5B><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82><EFBFBD><EFBFBD>B
|
||||
ハンドラが真偽値 `false` を返すと、このイベントに続くフォームの検証は中止されます。
|
||||
その結果、`afterValidate` イベントもトリガーされません。
|
||||
|
||||
### `afterValidate`
|
||||
|
||||
`afterValidate` <20>C<EFBFBD>x<EFBFBD><78><EFBFBD>g<EFBFBD>́A<CD81>t<EFBFBD>H<EFBFBD>[<5B><><EFBFBD>S<EFBFBD>̂<EFBFBD><CC82><EFBFBD><EFBFBD><EFBFBD><D882><EFBFBD><EFBFBD><EFBFBD><EFBFBD>Ńg<C583><67><EFBFBD>K<EFBFBD>[<5B><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
`afterValidate` イベントは、フォーム全体を検証した後でトリガーされます。
|
||||
|
||||
<EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>n<EFBFBD><EFBFBD><EFBFBD>h<EFBFBD><EFBFBD><EFBFBD>̃V<EFBFBD>O<EFBFBD>j<EFBFBD>`<60><><EFBFBD>͈ȉ<CD88><C889>̒ʂ<CC92>:
|
||||
イベントハンドラのシグニチャは以下の通り:
|
||||
|
||||
```javascript
|
||||
function (event, messages, errorAttributes)
|
||||
```
|
||||
|
||||
<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>͈ȉ<EFBFBD><EFBFBD>̒ʂ<EFBFBD>:
|
||||
引数は以下の通り:
|
||||
|
||||
- `event`: <EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>̃I<EFBFBD>u<EFBFBD>W<EFBFBD>F<EFBFBD>N<EFBFBD>g<EFBFBD>B
|
||||
- `messages`: <EFBFBD>A<EFBFBD>z<EFBFBD>z<EFBFBD><EFBFBD><EFBFBD>ŁA<EFBFBD>L<EFBFBD>[<5B>͑<EFBFBD><CD91><EFBFBD><EFBFBD><EFBFBD> ID<49>A<EFBFBD>l<EFBFBD>͑Ή<CD91><CE89><EFBFBD><EFBFBD>鑮<EFBFBD><E991AE><EFBFBD>̃G<CC83><47><EFBFBD>[<5B><><EFBFBD>b<EFBFBD>Z<EFBFBD>[<5B>W<EFBFBD>̔z<CC94><7A><EFBFBD>ł<EFBFBD><C582>B
|
||||
- `errorAttributes`: <EFBFBD><EFBFBD><EFBFBD>G<EFBFBD><EFBFBD><EFBFBD>[<5B><><EFBFBD><EFBFBD><EFBFBD>鑮<EFBFBD><E991AE><EFBFBD>̔z<CC94><7A><EFBFBD>B<EFBFBD><42><EFBFBD>̈<EFBFBD><CC88><EFBFBD><EFBFBD>̍\<5C><><EFBFBD>ɂ<C982><C282>Ă<EFBFBD> `attributeDefaults` <20><><EFBFBD>Q<EFBFBD>Ƃ<EFBFBD><C682>ĉ<EFBFBD><C489><EFBFBD><EFBFBD><EFBFBD><EFBFBD>B
|
||||
- `event`: イベントのオブジェクト。
|
||||
- `messages`: 連想配列で、キーは属性の ID、値は対応する属性のエラーメッセージの配列です。
|
||||
- `errorAttributes`: 検証エラーがある属性の配列。この引数の構造については `attributeDefaults` を参照して下さい。
|
||||
|
||||
### `beforeValidateAttribute`
|
||||
|
||||
`beforeValidateAttribute` <20>C<EFBFBD>x<EFBFBD><78><EFBFBD>g<EFBFBD>́A<CD81><41><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><D882><EFBFBD><EFBFBD>O<EFBFBD>Ƀg<C983><67><EFBFBD>K<EFBFBD>[<5B><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
`beforeValidateAttribute` イベントは、属性を検証する前にトリガーされます。
|
||||
|
||||
<EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>n<EFBFBD><EFBFBD><EFBFBD>h<EFBFBD><EFBFBD><EFBFBD>̃V<EFBFBD>O<EFBFBD>j<EFBFBD>`<60><><EFBFBD>͈ȉ<CD88><C889>̒ʂ<CC92>:
|
||||
イベントハンドラのシグニチャは以下の通り:
|
||||
|
||||
```javascript
|
||||
function (event, attribute, messages, deferreds)
|
||||
```
|
||||
|
||||
<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>͈ȉ<EFBFBD><EFBFBD>̒ʂ<EFBFBD>:
|
||||
引数は以下の通り:
|
||||
|
||||
- `event`: <EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>̃I<EFBFBD>u<EFBFBD>W<EFBFBD>F<EFBFBD>N<EFBFBD>g<EFBFBD>B
|
||||
- `attribute`: <EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>鑮<EFBFBD><EFBFBD><EFBFBD>B<EFBFBD><EFBFBD><EFBFBD>̈<EFBFBD><EFBFBD><EFBFBD><EFBFBD>̍\<5C><><EFBFBD>ɂ<C982><C282>Ă<EFBFBD> `attributeDefaults` <20><><EFBFBD>Q<EFBFBD>Ƃ<EFBFBD><C682>ĉ<EFBFBD><C489><EFBFBD><EFBFBD><EFBFBD><EFBFBD>B
|
||||
- `messages`: <EFBFBD>w<EFBFBD>肳<EFBFBD>ꂽ<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>ɑ<EFBFBD><EFBFBD>錟<EFBFBD>G<EFBFBD><EFBFBD><EFBFBD>[<5B><><EFBFBD>b<EFBFBD>Z<EFBFBD>[<5B>W<EFBFBD><57><EFBFBD>lj<EFBFBD><C789><EFBFBD><EFBFBD>邱<EFBFBD>Ƃ<EFBFBD><C682>o<EFBFBD><6F><EFBFBD><EFBFBD><EFBFBD>z<EFBFBD><7A><EFBFBD>B
|
||||
- `deferreds`: Deferred <EFBFBD>I<EFBFBD>u<EFBFBD>W<EFBFBD>F<EFBFBD>N<EFBFBD>g<EFBFBD>̔z<EFBFBD><EFBFBD><EFBFBD>B`deferreds.add(callback)` <20><><EFBFBD>g<EFBFBD><67><EFBFBD>āA<C481>V<EFBFBD><56><EFBFBD><EFBFBD> deferrd <20>Ȍ<EFBFBD><C88C><EFBFBD><D882>lj<EFBFBD><C789><EFBFBD><EFBFBD>邱<EFBFBD>Ƃ<EFBFBD><C682>o<EFBFBD><6F><EFBFBD>܂<EFBFBD><DC82>B
|
||||
- `event`: イベントのオブジェクト。
|
||||
- `attribute`: 検証される属性。この引数の構造については `attributeDefaults` を参照して下さい。
|
||||
- `messages`: 指定された属性に対する検証エラーメッセージを追加することが出来る配列。
|
||||
- `deferreds`: Deferred オブジェクトの配列。`deferreds.add(callback)` を使って、新しい deferrd な検証を追加することが出来ます。
|
||||
|
||||
<EFBFBD>n<EFBFBD><EFBFBD><EFBFBD>h<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>^<5E>U<EFBFBD>l `false` <20><><EFBFBD>Ԃ<EFBFBD><D482>ƁA<C681>w<EFBFBD>肳<EFBFBD>ꂽ<EFBFBD><EA82BD><EFBFBD><EFBFBD><EFBFBD>̌<EFBFBD><CC8C>͒<D882><CD92>~<7E><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
<EFBFBD><EFBFBD><EFBFBD>̌<EFBFBD><EFBFBD>ʁA`afterValidateAttribute` <20>C<EFBFBD>x<EFBFBD><78><EFBFBD>g<EFBFBD><67><EFBFBD>g<EFBFBD><67><EFBFBD>K<EFBFBD>[<5B><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82><EFBFBD><EFBFBD>B
|
||||
ハンドラが真偽値 `false` を返すと、指定された属性の検証は中止されます。
|
||||
その結果、`afterValidateAttribute` イベントもトリガーされません。
|
||||
|
||||
### `afterValidateAttribute`
|
||||
|
||||
`afterValidateAttribute` <20>C<EFBFBD>x<EFBFBD><78><EFBFBD>g<EFBFBD>́A<CD81>t<EFBFBD>H<EFBFBD>[<5B><><EFBFBD>S<EFBFBD>̂<EFBFBD><CC82><EFBFBD><EFBFBD>ъe<D18A><65><EFBFBD><EFBFBD><EFBFBD>̌<EFBFBD><CC8C>̌<D882><CC8C>Ƀg<C983><67><EFBFBD>K<EFBFBD>[<5B><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
`afterValidateAttribute` イベントは、フォーム全体および各属性の検証の後にトリガーされます。
|
||||
|
||||
<EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>n<EFBFBD><EFBFBD><EFBFBD>h<EFBFBD><EFBFBD><EFBFBD>̃V<EFBFBD>O<EFBFBD>j<EFBFBD>`<60><><EFBFBD>͈ȉ<CD88><C889>̒ʂ<CC92>:
|
||||
イベントハンドラのシグニチャは以下の通り:
|
||||
|
||||
```javascript
|
||||
function (event, attribute, messages)
|
||||
```
|
||||
|
||||
<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>͈ȉ<EFBFBD><EFBFBD>̒ʂ<EFBFBD>:
|
||||
引数は以下の通り:
|
||||
|
||||
- `event`: <EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>̃I<EFBFBD>u<EFBFBD>W<EFBFBD>F<EFBFBD>N<EFBFBD>g<EFBFBD>B
|
||||
- `attribute`: <EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>鑮<EFBFBD><EFBFBD><EFBFBD>B<EFBFBD><EFBFBD><EFBFBD>̈<EFBFBD><EFBFBD><EFBFBD><EFBFBD>̍\<5C><><EFBFBD>ɂ<C982><C282>Ă<EFBFBD> `attributeDefaults` <20><><EFBFBD>Q<EFBFBD>Ƃ<EFBFBD><C682>ĉ<EFBFBD><C489><EFBFBD><EFBFBD><EFBFBD><EFBFBD>B
|
||||
- `messages`: <EFBFBD>w<EFBFBD>肳<EFBFBD>ꂽ<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>ɑ<EFBFBD><EFBFBD><EFBFBD><EFBFBD>lj<EFBFBD><EFBFBD>̌<EFBFBD><EFBFBD>G<EFBFBD><EFBFBD><EFBFBD>[<5B><><EFBFBD>b<EFBFBD>Z<EFBFBD>[<5B>W<EFBFBD><57><EFBFBD>lj<EFBFBD><C789><EFBFBD><EFBFBD>邱<EFBFBD>Ƃ<EFBFBD><C682>o<EFBFBD><6F><EFBFBD><EFBFBD><EFBFBD>z<EFBFBD><7A><EFBFBD>B
|
||||
- `event`: イベントのオブジェクト。
|
||||
- `attribute`: 検証される属性。この引数の構造については `attributeDefaults` を参照して下さい。
|
||||
- `messages`: 指定された属性に対する追加の検証エラーメッセージを追加することが出来る配列。
|
||||
|
||||
### `beforeSubmit`
|
||||
|
||||
`beforeSubmit` <20>C<EFBFBD>x<EFBFBD><78><EFBFBD>g<EFBFBD>́A<CD81>S<EFBFBD>Ă̌<C482><CC8C><EFBFBD><D882>ʂ<EFBFBD><CA82><EFBFBD><EFBFBD><EFBFBD><EFBFBD>A<EFBFBD>t<EFBFBD>H<EFBFBD>[<5B><><EFBFBD>𑗐M<F0919790><4D><EFBFBD><EFBFBD><EFBFBD>O<EFBFBD>Ƀg<C983><67><EFBFBD>K<EFBFBD>[<5B><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
`beforeSubmit` イベントは、全ての検証が通った後、フォームを送信する前にトリガーされます。
|
||||
|
||||
<EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>n<EFBFBD><EFBFBD><EFBFBD>h<EFBFBD><EFBFBD><EFBFBD>̃V<EFBFBD>O<EFBFBD>j<EFBFBD>`<60><><EFBFBD>͈ȉ<CD88><C889>̒ʂ<CC92>:
|
||||
イベントハンドラのシグニチャは以下の通り:
|
||||
|
||||
```javascript
|
||||
function (event)
|
||||
```
|
||||
|
||||
<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>͈ȉ<EFBFBD><EFBFBD>̒ʂ<EFBFBD>:
|
||||
引数は以下の通り:
|
||||
|
||||
- `event`: <EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>̃I<EFBFBD>u<EFBFBD>W<EFBFBD>F<EFBFBD>N<EFBFBD>g<EFBFBD>B
|
||||
- `event`: イベントのオブジェクト。
|
||||
|
||||
<EFBFBD>n<EFBFBD><EFBFBD><EFBFBD>h<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>^<5E>U<EFBFBD>l `false` <20><><EFBFBD>Ԃ<EFBFBD><D482>ƁA<C681>t<EFBFBD>H<EFBFBD>[<5B><><EFBFBD>̑<EFBFBD><CC91>M<EFBFBD>͒<EFBFBD><CD92>~<7E><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
ハンドラが真偽値 `false` を返すと、フォームの送信は中止されます。
|
||||
|
||||
### `ajaxBeforeSend`
|
||||
|
||||
`ajaxBeforeSend` <20>C<EFBFBD>x<EFBFBD><78><EFBFBD>g<EFBFBD>́AAJAX <20>x<EFBFBD>[<5B>X<EFBFBD>̌<EFBFBD><CC8C>̂<D882><CC82>߂<EFBFBD> AJAX <20><><EFBFBD>N<EFBFBD>G<EFBFBD>X<EFBFBD>g<EFBFBD>𑗐M<F0919790><4D><EFBFBD><EFBFBD><EFBFBD>O<EFBFBD>Ƀg<C983><67><EFBFBD>K<EFBFBD>[<5B><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
`ajaxBeforeSend` イベントは、AJAX ベースの検証のための AJAX リクエストを送信する前にトリガーされます。
|
||||
|
||||
<EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>n<EFBFBD><EFBFBD><EFBFBD>h<EFBFBD><EFBFBD><EFBFBD>̃V<EFBFBD>O<EFBFBD>j<EFBFBD>`<60><><EFBFBD>͈ȉ<CD88><C889>̒ʂ<CC92>:
|
||||
イベントハンドラのシグニチャは以下の通り:
|
||||
|
||||
```javascript
|
||||
function (event, jqXHR, settings)
|
||||
```
|
||||
|
||||
<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>͈ȉ<EFBFBD><EFBFBD>̒ʂ<EFBFBD>:
|
||||
引数は以下の通り:
|
||||
|
||||
- `event`: <EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>̃I<EFBFBD>u<EFBFBD>W<EFBFBD>F<EFBFBD>N<EFBFBD>g<EFBFBD>B
|
||||
- `jqXHR`: jqXHR <EFBFBD>̃I<EFBFBD>u<EFBFBD>W<EFBFBD>F<EFBFBD>N<EFBFBD>g<EFBFBD>B
|
||||
- `settings`: AJAX <EFBFBD><EFBFBD><EFBFBD>N<EFBFBD>G<EFBFBD>X<EFBFBD>g<EFBFBD>̐ݒ<EFBFBD><EFBFBD>B
|
||||
- `event`: イベントのオブジェクト。
|
||||
- `jqXHR`: jqXHR のオブジェクト。
|
||||
- `settings`: AJAX リクエストの設定。
|
||||
|
||||
### `ajaxComplete`
|
||||
|
||||
`ajaxComplete` <20>C<EFBFBD>x<EFBFBD><78><EFBFBD>g<EFBFBD><67>AJAX <20>x<EFBFBD>[<5B>X<EFBFBD>̌<EFBFBD><CC8C>̂<D882><CC82>߂<EFBFBD> AJAX <20><><EFBFBD>N<EFBFBD>G<EFBFBD>X<EFBFBD>g<EFBFBD><67><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>Ƀg<C983><67><EFBFBD>K<EFBFBD>[<5B><><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
`ajaxComplete` イベントはAJAX ベースの検証のための AJAX リクエストが完了した後にトリガーされます。
|
||||
|
||||
<EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>n<EFBFBD><EFBFBD><EFBFBD>h<EFBFBD><EFBFBD><EFBFBD>̃V<EFBFBD>O<EFBFBD>j<EFBFBD>`<60><><EFBFBD>͈ȉ<CD88><C889>̒ʂ<CC92>:
|
||||
イベントハンドラのシグニチャは以下の通り:
|
||||
|
||||
```javascript
|
||||
function (event, jqXHR, textStatus)
|
||||
```
|
||||
|
||||
<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>͈ȉ<EFBFBD><EFBFBD>̒ʂ<EFBFBD>:
|
||||
引数は以下の通り:
|
||||
|
||||
- `event`: <EFBFBD>C<EFBFBD>x<EFBFBD><EFBFBD><EFBFBD>g<EFBFBD>̃I<EFBFBD>u<EFBFBD>W<EFBFBD>F<EFBFBD>N<EFBFBD>g<EFBFBD>B
|
||||
- `jqXHR`: jqXHR <EFBFBD>̃I<EFBFBD>u<EFBFBD>W<EFBFBD>F<EFBFBD>N<EFBFBD>g<EFBFBD>B
|
||||
- `textStatus`: <EFBFBD><EFBFBD><EFBFBD>N<EFBFBD>G<EFBFBD>X<EFBFBD>g<EFBFBD>̏<EFBFBD><EFBFBD><EFBFBD> ("success", "notmodified", "error", "timeout",
|
||||
"abort", <EFBFBD>܂<EFBFBD><EFBFBD><EFBFBD> "parsererror")<EFBFBD>B
|
||||
- `event`: イベントのオブジェクト。
|
||||
- `jqXHR`: jqXHR のオブジェクト。
|
||||
- `textStatus`: リクエストの状態 ("success", "notmodified", "error", "timeout",
|
||||
"abort", または "parsererror")。
|
||||
|
||||
## AJAX <EFBFBD>Ńt<EFBFBD>H<EFBFBD>[<5B><><EFBFBD>𑗐M<F0919790><4D><EFBFBD><EFBFBD>
|
||||
## AJAX でフォームを送信する
|
||||
|
||||
<EFBFBD><EFBFBD><EFBFBD><EFBFBD>(<28>o<EFBFBD><6F><EFBFBD>f<EFBFBD>[<5B>V<EFBFBD><56><EFBFBD><EFBFBD>)<29>́A<CD81>N<EFBFBD><4E><EFBFBD>C<EFBFBD>A<EFBFBD><41><EFBFBD>g<EFBFBD>T<EFBFBD>C<EFBFBD>h<EFBFBD>܂<EFBFBD><DC82><EFBFBD> AJAX <20><><EFBFBD>N<EFBFBD>G<EFBFBD>X<EFBFBD>g<EFBFBD>ɂ<EFBFBD><C982><EFBFBD><EFBFBD>čs<C48D><73><EFBFBD><EFBFBD><EFBFBD>Ƃ<EFBFBD><C682>o<EFBFBD><6F><EFBFBD>܂<EFBFBD><DC82><EFBFBD><EFBFBD>A
|
||||
<EFBFBD>t<EFBFBD>H<EFBFBD>[<5B><><EFBFBD>̑<EFBFBD><CC91>M<EFBFBD><4D><EFBFBD>̂<EFBFBD><CC82>̂̓f<CD83>t<EFBFBD>H<EFBFBD><48><EFBFBD>g<EFBFBD>ł͒ʏ<CD92><CA8F>̃<EFBFBD><CC83>N<EFBFBD>G<EFBFBD>X<EFBFBD>g<EFBFBD>Ƃ<EFBFBD><C682>Ď<EFBFBD><C48E>s<EFBFBD><73><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
<EFBFBD>t<EFBFBD>H<EFBFBD>[<5B><><EFBFBD><EFBFBD> AJAX <20>ő<EFBFBD><C591>M<EFBFBD><4D><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>ꍇ<EFBFBD>́A<CD81><41><EFBFBD>̂悤<CC82>ɁA<C981>t<EFBFBD>H<EFBFBD>[<5B><><EFBFBD><EFBFBD> `beforeSubmit` <20>C<EFBFBD>x<EFBFBD><78><EFBFBD>g<EFBFBD><67><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>邱<EFBFBD>Ƃɂ<C682><C982><EFBFBD><EFBFBD>ĒB<C492><42><EFBFBD><EFBFBD><EFBFBD>邱<EFBFBD>Ƃ<EFBFBD><C682>o<EFBFBD><6F><EFBFBD>܂<EFBFBD><DC82>B
|
||||
検証(バリデーション)は、クライアントサイドまたは AJAX リクエストによって行うことが出来ますが、
|
||||
フォームの送信そのものはデフォルトでは通常のリクエストとして実行されます。
|
||||
フォームを AJAX で送信したい場合は、次のように、フォームの `beforeSubmit` イベントを処理することによって達成することが出来ます。
|
||||
|
||||
```javascript
|
||||
var $form = $('#formId');
|
||||
@ -156,26 +156,26 @@ $form.on('beforeSubmit', function() {
|
||||
type: 'POST',
|
||||
data: data,
|
||||
success: function (data) {
|
||||
// <EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>Ƃ<EFBFBD><EFBFBD>̎<EFBFBD><EFBFBD><EFBFBD>
|
||||
// 成功したときの実装
|
||||
},
|
||||
error: function(jqXHR, errMsg) {
|
||||
alert(errMsg);
|
||||
}
|
||||
});
|
||||
return false; // <20>f<EFBFBD>t<EFBFBD>H<EFBFBD><48><EFBFBD>g<EFBFBD>̑<EFBFBD><CC91>M<EFBFBD><4D><EFBFBD>}<7D>~
|
||||
return false; // デフォルトの送信を抑止
|
||||
});
|
||||
```
|
||||
|
||||
jQuery <EFBFBD><EFBFBD> `ajax()` <20><EFBFBD><D690>ɂ<C982><C282>čX<C48D>Ɋw<C98A>K<EFBFBD><4B><EFBFBD>邽<EFBFBD>߂ɂ́A[jQuery documentation](https://api.jquery.com/jQuery.ajax/) <EFBFBD><EFBFBD><EFBFBD>Q<EFBFBD>Ƃ<EFBFBD><EFBFBD>ĉ<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>B
|
||||
jQuery の `ajax()` 関数について更に学習するためには、[jQuery documentation](https://api.jquery.com/jQuery.ajax/) を参照して下さい。
|
||||
|
||||
|
||||
## <EFBFBD>t<EFBFBD>B<EFBFBD>[<5B><><EFBFBD>h<EFBFBD>I<F093AE93>ɒlj<C992><C789><EFBFBD><EFBFBD><EFBFBD>
|
||||
## フィールドを動的に追加する
|
||||
|
||||
<EFBFBD><EFBFBD><EFBFBD>݂̃E<EFBFBD>F<EFBFBD>u<EFBFBD>E<EFBFBD>A<EFBFBD>v<EFBFBD><EFBFBD><EFBFBD>P<EFBFBD>[<5B>V<EFBFBD><56><EFBFBD><EFBFBD><EFBFBD>ł́A<CD81><41><EFBFBD>[<5B>U<EFBFBD>ɑ<C991><CE82>ĕ\<5C><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>Ńt<C583>H<EFBFBD>[<5B><><EFBFBD><EFBFBD><EFBFBD>ύX<CF8D><58><EFBFBD><EFBFBD><EFBFBD>K<EFBFBD>v<EFBFBD><76><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>ꍇ<EFBFBD><EA8D87><EFBFBD>悭<EFBFBD><E682AD><EFBFBD><EFBFBD><EFBFBD>܂<EFBFBD><DC82>B
|
||||
<EFBFBD>Ⴆ<EFBFBD>A"<22>lj<EFBFBD>"<22>A<EFBFBD>C<EFBFBD>R<EFBFBD><52><EFBFBD><EFBFBD><EFBFBD>N<EFBFBD><4E><EFBFBD>b<EFBFBD>N<EFBFBD><4E><EFBFBD><EFBFBD><EFBFBD>ƃt<C683>B<EFBFBD>[<5B><><EFBFBD>h<EFBFBD><68><EFBFBD>lj<EFBFBD><C789><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>ꍇ<EFBFBD>Ȃǂł<C782><C582>B
|
||||
<EFBFBD><EFBFBD><EFBFBD>̂悤<EFBFBD>ȃt<EFBFBD>B<EFBFBD>[<5B><><EFBFBD>h<EFBFBD>ɑ<C991><CE82><EFBFBD><EFBFBD>N<EFBFBD><4E><EFBFBD>C<EFBFBD>A<EFBFBD><41><EFBFBD>g<EFBFBD>E<EFBFBD>o<EFBFBD><6F><EFBFBD>f<EFBFBD>[<5B>V<EFBFBD><56><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>L<EFBFBD><4C><EFBFBD>ɂ<EFBFBD><C982>邽<EFBFBD>߂ɂ́A<CD81>t<EFBFBD>B<EFBFBD>[<5B><><EFBFBD>h<EFBFBD><68> ActiveForm JavaScript <20>v<EFBFBD><76><EFBFBD>O<EFBFBD>C<EFBFBD><43><EFBFBD>ɓo<C993>^<5E><><EFBFBD>Ȃ<EFBFBD><C882><EFBFBD><EFBFBD>Ȃ<CE82><C882>܂<EFBFBD><DC82><EFBFBD><EFBFBD>B
|
||||
現在のウェブ・アプリケーションでは、ユーザに対して表示した後でフォームを変更する必要がある場合がよくあります。
|
||||
例えば、"追加"アイコンをクリックするとフィールドが追加される場合などです。
|
||||
このようなフィールドに対するクライアント・バリデーションを有効にするためには、フィールドを ActiveForm JavaScript プラグインに登録しなければなりません。
|
||||
|
||||
<EFBFBD>t<EFBFBD>B<EFBFBD>[<5B><><EFBFBD>h<EFBFBD><68><EFBFBD>̂<EFBFBD><CC82>̂<EFBFBD><CC82>lj<EFBFBD><C789><EFBFBD><EFBFBD>āA<C481><41><EFBFBD><EFBFBD><EFBFBD>āA<C481>o<EFBFBD><6F><EFBFBD>f<EFBFBD>[<5B>V<EFBFBD><56><EFBFBD><EFBFBD><EFBFBD>̃<EFBFBD><CC83>X<EFBFBD>g<EFBFBD>ɒlj<C992><C789><EFBFBD><EFBFBD>Ȃ<EFBFBD><C882><EFBFBD><EFBFBD>Ȃ<CE82><C882>܂<EFBFBD><DC82><EFBFBD><EFBFBD>B
|
||||
フィールドそのものを追加して、そして、バリデーションのリストに追加しなければなりません。
|
||||
|
||||
```javascript
|
||||
$('#contact-form').yiiActiveForm('add', {
|
||||
@ -190,7 +190,7 @@ $('#contact-form').yiiActiveForm('add', {
|
||||
});
|
||||
```
|
||||
|
||||
<EFBFBD>t<EFBFBD>B<EFBFBD>[<5B><><EFBFBD>h<EFBFBD><68><EFBFBD>o<EFBFBD><6F><EFBFBD>f<EFBFBD>[<5B>V<EFBFBD><56><EFBFBD><EFBFBD><EFBFBD>̃<EFBFBD><CC83>X<EFBFBD>g<EFBFBD><67><EFBFBD><EFBFBD><EFBFBD>폜<EFBFBD><ED8F9C><EFBFBD>Č<EFBFBD><C48C><EFBFBD><D882><EFBFBD><EFBFBD>Ȃ<EFBFBD><C882>悤<EFBFBD>ɂ<EFBFBD><C982>邽<EFBFBD>߂ɂ́A<CD81><41><EFBFBD>̂悤<CC82>ɂ<EFBFBD><C982>܂<EFBFBD><DC82>B
|
||||
フィールドをバリデーションのリストから削除して検証されないようにするためには、次のようにします。
|
||||
|
||||
```javascript
|
||||
$('#contact-form').yiiActiveForm('remove', 'address');
|
||||
|
||||
Reference in New Issue
Block a user