React Grid 編集と検証

React IgrGrid の編集は、セル/行の編集時のユーザー入力の検証メカニズムが組み込まれた編集を提供します。これはフォームの検証機能を拡張し、既知の機能と簡単に統合できるようにします。エディターの状態が変更されると、IgrGrid 内の編集されたセルに視覚的なインジケーターが適用されます。

構成

テンプレート駆動で構成する

React Forms 検証は、IgrColumn で直接動作するよう拡張されています。同じ検証が IgrColumn で宣言的に設定される属性として利用できます。以下の検証は追加設定なしでサポートされます。

• Required
• Min
• Max
• Email
• MinLength
• MaxLength
• Pattern

列入力が設定され、値がメールとして書式設定されることを検証するには、関連するディレクティブを使用できます。

検証サービス API

グリッドは、Validation プロパティを介して検証サービスを公開します。

このサービスには以下のパブリック API があります。

• Valid - グリッドの検証状態が有効であるかどうかを返します。
• GetInvalid - 無効な状態のレコードを返します。
• Clear - レコードの状態を ID でクリアします。ID が提供されない場合はすべてのレコードの状態をクリアします。
• MarkAsTouched - 関連するレコード / フィールドをタッチ済みとしてマークします。

無効な状態は、検証ルールに従って検証エラーが修正されるか、クリアされるまで保持されます。

検証トリガー

検証は以下のシナリオでトリガーされます。

• グリッドの GridValidationTrigger に基づくセルエディターでの編集中。エディター入力中の変更時 (Change)、またはエディターがフォーカスを失うか (Blur) 閉じた場合。
• UpdateRow、UpdateCell などの API を使用してセル / 行を更新する場合 。
• トランザクション サービスの一括編集および Undo/Redo API を使用する場合。

API リファレンス

その他のリソース

• Grid 編集
• Grid 行の編集
• Grid 行の追加
• Grid トランザクション

コミュニティに参加して新しいアイデアをご提案ください。