このトピックは、コード例を用いて、igGrid
™ の列移動機能構成する方法について説明します。
このトピックを理解するために、以下のトピックを参照することをお勧めします。
igGrid
コントロールの列移動機能およびこの機能が提供する機能性について概念的に説明します。このトピックは、以下のセクションで構成されます。
igGrid
は、デフォルトでは列移動はサポートしません。このため、明示的に有効にする必要があります。これは、JavaScript と ASP.NET MVC では異なります。
以下において列移動を有効にするには | 以下を実行します。 |
---|---|
JavaScript ファイル | グリッドの features 配列において列移動構成を定義します。 |
ASP.NET MVC | グリッドの Features メソッドに渡されるデリゲートで列移動機能をインスタンス化します。 |
以下は、このトピックで使用したコード例を示しています。
JavaScript で列移動を有効にする: この例は、JavaScript のデフォルト構成で igGrid
の 列移動機能を有効にする操作を示します。
ASP.NET MVCで列移動を有効にする: この例は、ASP.NET MVC のデフォルト構成で igGrid
の 列移動機能を有効にする操作を示します。
以下のコードは、AdventureWorks データベースからの製品表データにバインドされる igGrid
インスタンスを作成します。列は自動生成されます。列移動は、デフォルト構成で有効化されます。
JavaScript の場合:
$("#grid1").igGrid({
dataSource: adventureWorks,
autoGenerateColumns: true,
features: [
{
name: "ColumnMoving"
}
]
});
以下のコードは、ビューモデルとして定義されるカスタム Product
オブジェクト コレクションにバインドされる igGrid
インスタンスを作成します。列は自動生成されます。列移動は、デフォルト構成で有効化されます。
C# の場合:
Code
@model IQueryable<Sample.Models.Product>
@(Html.Infragistics()
.Grid(Model)
.AutoGenerateColumns(true)
.Features(feature =>
{
feature.ColumnMoving();
})
.DataBind()
.Render())
このトピックの追加情報については、以下のトピックも合わせてご参照ください。
列移動の構成: このトピックでは、コード例を用いて、igGrid
の列移動機能を構成する方法について説明します。
コードによる列の移動: このトピックは、列移動 API を使用して列を移動する方法をコード例を用いて説明します。
プロパティ リファレンス: このトピックは、igGrid
の列移動機能 API の一部のプロパティに関する参考情報を提供します。
このトピックについては、以下のサンプルも参照してください。
igGrid
の列移動の構成を示します。オンラインで表示: GitHub