Articles Tagged: IgxGrid

IgxGrid では dataType=”number” の列ヘッダー ( .igx-grid-th–number ) に対し、他のデータ型とは異なるスタイルが適用されるため、デフォル […]

IgxGrid ではバージョン 21 にて PDF へのエクスポート機能が導入されました。以下のように IgxGridToolbarExporterComponent より機能を有効に設定すると、IgxGrid のツール […]

IgxGrid のフィルター機能はバインドされたデータの値を使用して実行されます。そのため、例えば Date 型のデータがバインドされた列で表示を時間のみに制限した場合、フィルター時に入力値が正しいにも関わらず、年月部分 […]

IgxGrid には同じ値を持つ縦方向に隣接するセルを結合して表示する機能が実装されています。既定では一致するデータを持つセルが自動的に結合されますが、カスタムの条件を設定して結合するように構成することも可能です。 ここ […]

この記事では、行削除の確認ダイアログを表示し、ユーザーが「キャンセル」を選んだ場合には削除処理を中止する方法を紹介します。 IgxGrid の設定 rowDeleteイベントを利用すると、削除直前に処理を挟むことができま […]

この記事では、エクスポートの開始時にファイル名をユーザー入力で設定する方法を紹介します。 IgxGrid の設定 IgxGridToolbarExporterComponent のexportStartedイベントをバイ […]

IgxGrid では、列のドラッグ＆ドロップによる移動が可能ですが、特定の列は移動できないように制御したいケースもあります。この記事では、「Name」列を固定し、それ以外の列のみ移動を許可する実装方法を紹介します。 Ig […]

igxGridのセルテンプレート機能を使用してセルにボタンを配置し、cssによって表示を行のホバー時に限定することができます。 以下の例では「col3」列にテンプレートを設定し、ボタンを配置しています。 cssを以下のよ […]

IgxGrid においてデータのフォーマットをカスタマイズする方法についてご紹介します。本記事では、formatterを使用して、数値データに単位を付加する方法を解説します。 IgxGrid の設定 IgxGrid のf […]