igGridのセルに、入力ボックスを常に表示させたい場合は、 columnsのtemplateオプションを使用して、HTMLのinputタグを埋め込む。 埋め込んだinputタグに入力された値をigGridのセルの値とし […]
Articles Tagged: igGrid
igGrid は table 要素に生成する
igGrid を用意する際、div 要素に生成すると、API を呼び出すことができずコンソールには以下のようなエラーが出力されます。 igGrid は table 要素に生成することでAPI を利用することが可能となりま […]
igGrid の行選択イベント取得方法
igGridの行選択イベントは igGridSelection の rowSelectionChanged です。 ui.igGridSelection – rowSelectionChangedhttps: […]
igGrid – 集計行をセルごとに別の書式で表示させたい
SummariesのrenderSummaryCellFuncプロパティで書式化するfunctionを指定できます。列ごとによる制御、集計関数ごとによる制御も可能です。 サンプル APIリファレンス render […]
検索結果に応じたデータを igGrid にバインドする
初期表示では igGrid にデータをバインドせず、検索条件に応じて結果を igGrid にバインドする方法を紹介します。 1.igGrid の宣言 igGrid の各種プロパティ設定を行います。 (今回は MVC He […]
igGrid セルの編集にコンボボックスを利用する
igGrid では編集時にデフォルトの動作として、データタイプに応じたエディタが自動生成されますが、エディタにコンボボックスを利用することもできます。下記、実装例です。 参照:igCombo エディター プロバイダーの操 […]
ASP.NET Core Razor Pages で igGrid 更新機能を利用する
ASP.NET Core Razor Pages 上に igGrid を配置し、igGrid の編集内容をサーバーに送信するサンプルです。サーバー側での処理が終わった後、クライアント側で igGrid の編集内容を確定し […]
igGrid のサイズをウィンドウ幅に応じて自動的に変更する
window のリサイズイベントのタイミングで、igGrid の高さ(height)と幅(width)を書き換えることで対応することができます。 実装例
igGrid のバインドデータをクリアする
igGrid のバインドデータをクリアするには、空の配列を dataSource オプションに指定致します。これにより、ヘッダーは残りますが、データ行はクリアされます。 実行結果
igGrid マウスをホバーしたセルをハイライトする
igGrid でマウスをホバーしたセルをハイライト(強調表示)する場合、下記実装を行います。 1.デフォルトの行ハイライトを無効化します。 2.igGrid のセルに対して、mouseenter と mouseleave […]