igx-grid のグリッド領域に対してマウスを上下左右の端まで近づけると、その方向へ自動的にスクロールできるようにする方法を紹介します。この動作は、水平方向のスクロールを担うheaderContainerと垂直方向のス […]
Articles Tagged: IgxGrid
IgxGrid – groupingComparer と sortStrategy でグループ化をカスタマイズする方法
igx-grid で列をグループ化する際、同じ値でも行データの他の項目によってグループを分けたい場合は、groupingComparer と sortStrategy を組み合わせてグループ化ロジックをカスタマイズします […]
IgxGrid – Boolean 列のフィルター項目のテキストを変更する
IgxGrid の Excel スタイルフィルターメニューの項目にはデータの値がテキストで表示されます。そのため、DataType = Boolean の列では項目名が「 True 」と「 False 」で表示されます。 […]
IgxGrid – 数値型の列ヘッダーの表示を他のデータ型列と統一する
IgxGrid では dataType=”number” の列ヘッダー ( .igx-grid-th–number ) に対し、他のデータ型とは異なるスタイルが適用されるため、デフォル […]
IgxGrid – Excel Style Filter のテンプレート機能を使ってメニュー表示をカスタマイズする方法
概要 Ignite UI for Angular の IgxGrid では、Excel Style Filter メニューの表示内容をテンプレート機能で細かくカスタマイズできます。 Excel Style Filter […]
IgxGrid を PDF へエクスポートすると日本語が文字化けする
IgxGrid ではバージョン 21 にて PDF へのエクスポート機能が導入されました。以下のように IgxGridToolbarExporterComponent より機能を有効に設定すると、IgxGrid のツール […]
IgxGrid – FilteringStrategyを使用してカスタムのフィルタリングを行う
IgxGrid のフィルター機能はバインドされたデータの値を使用して実行されます。そのため、例えば Date 型のデータがバインドされた列で表示を時間のみに制限した場合、フィルター時に入力値が正しいにも関わらず、年月部分 […]
IgxGrid のセル結合でカスタムの結合条件を定義する
IgxGrid には同じ値を持つ縦方向に隣接するセルを結合して表示する機能が実装されています。既定では一致するデータを持つセルが自動的に結合されますが、カスタムの条件を設定して結合するように構成することも可能です。 ここ […]
IgxGrid – 行削除をキャンセルしたい
この記事では、行削除の確認ダイアログを表示し、ユーザーが「キャンセル」を選んだ場合には削除処理を中止する方法を紹介します。 IgxGrid の設定 rowDeleteイベントを利用すると、削除直前に処理を挟むことができま […]
IgxGrid – エクスポートファイル名を指定したい
この記事では、エクスポートの開始時にファイル名をユーザー入力で設定する方法を紹介します。 IgxGrid の設定 IgxGridToolbarExporterComponent のexportStartedイベントをバイ […]