ASP.NET Core Razor Pages 上に igGrid を配置し、igGrid の編集内容をサーバーに送信するサンプルです。サーバー側での処理が終わった後、クライアント側で igGrid の編集内容を確定し […]
Articles Tagged: igGrid
igGrid のサイズをウィンドウ幅に応じて自動的に変更する
window のリサイズイベントのタイミングで、igGrid の高さ(height)と幅(width)を書き換えることで対応することができます。 実装例
igGrid のバインドデータをクリアする
igGrid のバインドデータをクリアするには、空の配列を dataSource オプションに指定致します。これにより、ヘッダーは残りますが、データ行はクリアされます。 実行結果
igGrid マウスをホバーしたセルをハイライトする
igGrid でマウスをホバーしたセルをハイライト(強調表示)する場合、下記実装を行います。 1.デフォルトの行ハイライトを無効化します。 2.igGrid のセルに対して、mouseenter と mouseleave […]
igGrid セルにマウスが入ったタイミングのイベントを捕捉したい
igGrid では、セルにマウスが入ったタイミングで発生するイベントの提供はございません。このため、igGrid のセル(TD 要素)に対して、jQuery などを用いて直接イベントハンドラーを登録していただくかたちとな […]
igGrid: 編集用 datePicker のオプション設定を行う
igGrid では、editorType に datePicker を指定することで、日付列の編集エディタとして、jQuery UI の datePicker を利用することができます。この datePicker はセル […]
igGridのプライマリーキーについて
igGridのprimaryKeyオプションには複数の項目を設定いただけません。データソース側で値が一意となる単一のデータ項目をご用意いただき、オプションに設定してください。
igGrid テンプレートセルにデータソースの値を埋め込む
igGrid のテンプレート機能では、セル内に任意のコントロールを配置することができます。また、テンプレート内にデータソースのバインドデータを埋め込むこともできます。バインドデータの埋め込みは、テンプレート内に ${ バ […]
igDialog 上に配置した igGrid でリモートソートを行う
igDialog に配置した igGrid でリモートソートを行う例をご紹介します。 ポイントは二つです。 igGrid では、dataSource オプションに URL を指定すると、リモートソート時にも同じ URL […]
igGrid リモートソーティングを利用する
igGrid では、バインドデータの並び替えをサーバー側で行う機能に対応しています。igGrid に対してソート処理を実行すると、igGrid のデータソースとして参照しているアクションを呼び出します。 呼び出されたアク […]