製品版のみの機能
階層グリッド - DataSet のバインド
このサンプルは CTP 機能を使用しています。製品版では、API や動作が変更される場合があります。
このサンプルは、より大きい画面サイズのためにデザインされました。
モバイル デバイスで画面を回転、フル サイズ表示、またはその他のデバイスにメールで送信します。
ASP.NET MVC ヘルパーを使用し、igHierarchicalGrid を直接 DataSet オブジェクトにバインドできます。このサンプルでは、DataSet オブジェクトにバインドされる自動生成された列およびレイアウトを構成した igHierarchicalGrid を紹介します。ページング機能はリモート モードで操作します。すべての機能は継承されるため、自動生成された子レイアウトにも利用可能です。
コード ビュー
クリップボードへコピー
@using Infragistics.Web.Mvc @using System.Data <!DOCTYPE html> <html> <head> <title></title> <!-- Ignite UI for jQuery Required Combined CSS Files --> <link href="http://cdn-na.infragistics.com/igniteui/2024.1/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" /> <link href="http://cdn-na.infragistics.com/igniteui/2024.1/latest/css/structure/infragistics.css" rel="stylesheet" /> <script src="http://ajax.aspnetcdn.com/ajax/modernizr/modernizr-2.8.3.js"></script> <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> <script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script> <!-- Ignite UI for jQuery Required Combined JavaScript Files --> <script src="http://cdn-na.infragistics.com/igniteui/2024.1/latest/js/infragistics.core.js"></script> <script src="http://cdn-na.infragistics.com/igniteui/2024.1/latest/js/infragistics.lob.js"></script> </head> <body> @(Html.Infragistics().Grid<System.Data.DataSet>() .ID("grid1") .Width("100%") .AutoGenerateColumns(true) .AutoGenerateLayouts(true) .Features(features => { features.Paging().PageSize(5).Type(OpType.Remote).Inherit(false); features.Selection().Mode(SelectionMode.Row).MultipleSelection(true); features.Hiding().Inherit(true); }) .DataSource(Model) .DataSourceUrl(Url.Action("dataset-binding")) .DataBind() .Render() ) </body> </html>
using System.Configuration; using System.Data; using System.Data.SqlClient; using System.Web.Mvc; using System.Linq; using Infragistics.Web.Mvc; using IgniteUI.SamplesBrowser.Models.Repositories; using IgniteUI.SamplesBrowser.Application.Data; using System.Collections.Generic; using IgniteUI.SamplesBrowser.Models.Northwind; using System; namespace IgniteUI.SamplesBrowser.Controllers { public class HierarchicalGridController : Controller { [ActionName("aspnet-mvc-helper")] public ActionResult AspMvcHelper() { GridModel gridModel = GetGridModel(); return View("aspnet-mvc-helper", gridModel); } [GridDataSourceAction] [ActionName("dataset-binding")] public ActionResult DataSetMvcHelper() { var categoriesProducts = this.CategoriesProducts; return View("dataset-binding", categoriesProducts); } [GridDataSourceAction] [ActionName("editing-dataset")] public ActionResult EditingDataSetMvcHelper() { var categoriesProducts = this.CategoriesProducts; return View("editing-dataset", categoriesProducts); } [ActionName("EditingSaveChanges")] public ActionResult EditingSaveChanges() { ViewData["GenerateCompactJSONResponse"] = false; GridModel m = new GridModel(); List<Transaction<Category>> categoryTransactions = m.LoadTransactions<Category>(HttpContext.Request.Form["ig_transactions"]); foreach (Transaction<Category> t in categoryTransactions) { DataRow dr = this.CategoriesProducts.Tables["Categories"].Rows.Find(Int32.Parse(t.rowId)); if ((t.layoutKey == null) && (dr != null)) { if (t.type == "row") { Category categoryRow = (Category)t.row; if (categoryRow.CategoryName != null) { dr["CategoryName"] = categoryRow.CategoryName; } if (categoryRow.Description != null){ dr["Description"] = categoryRow.Description; } } else if (t.type == "deleterow") { this.CategoriesProducts.Tables["Categories"].Rows.Remove(dr); } } } List<Transaction<Product>> productTransactions = m.LoadTransactions<Product>(HttpContext.Request.Form["ig_transactions"]); foreach (Transaction<Product> t in productTransactions) { DataRow dr = this.CategoriesProducts.Tables["Products"].Rows.Find(Int32.Parse(t.rowId)); if ((t.layoutKey == "Products") && (dr != null)) { if (t.type == "deleterow") { this.CategoriesProducts.Tables["Products"].Rows.Remove(dr); } else if (t.type == "row") { Product productRow = (Product)t.row; if (productRow.ProductName != null) { dr["ProductName"] = productRow.ProductName; } if (productRow.CategoryID != null) { dr["CategoryID"] = productRow.CategoryID; } if (productRow.UnitPrice != null) { dr["UnitPrice"] = productRow.UnitPrice; } if (productRow.UnitsInStock != null) { dr["UnitsInStock"] = productRow.UnitsInStock; } dr["Discontinued"] = productRow.Discontinued; } } } JsonResult result = new JsonResult(); Dictionary<string, bool> response = new Dictionary<string, bool>(); response.Add("Success", true); result.Data = response; return result; } [ActionName("load-on-demand")] public ActionResult DataSetWithLoadOnDemand() { GridModel grid = GridLoadOnDemandModel(); grid.ID = "gridLoadOnDemand"; grid.LoadOnDemand = true; grid.DataSourceUrl = this.Url.Action("BindParent"); grid.ColumnLayouts[0].DataSourceUrl = this.Url.Action("BindChild"); return View("load-on-demand", grid); } #region Grid Models private GridModel GetGridModel() { GridModel gridModel = new GridModel(); gridModel.ID = "gridModel"; gridModel.AutoGenerateColumns = false; gridModel.AutoGenerateLayouts = false; gridModel.PrimaryKey = "ID"; gridModel.LoadOnDemand = false; gridModel.Width = "100%"; gridModel.AutoFormat = GridAutoFormat.DateAndNumber; gridModel.Columns = new List<GridColumn>(); gridModel.Columns.Add(new GridColumn() { HeaderText = "カテゴリ ID", Key = "ID", DataType = "number", Width = "15%", Hidden = true }); gridModel.Columns.Add(new GridColumn() { HeaderText = "カテゴリ名", Key = "CategoryName", DataType = "string", Width = "30%" }); gridModel.Columns.Add(new GridColumn() { HeaderText = "説明", Key = "Description", DataType = "string", Width = "40%" }); gridModel.Columns.Add(new GridColumn() { HeaderText = "製品数", Key = "ProductCount", DataType = "number", Width = "15%" }); gridModel.DataSourceUrl = this.Url.Action("GetCategoriesData"); gridModel.DataSource = RepositoryFactory.GetCategoryRepository().Get().AsQueryable(); GridColumnLayoutModel productsModel = GetProductsLayout(); productsModel.AutoFormat = GridAutoFormat.DateAndNumber; gridModel.ColumnLayouts.Add(productsModel); gridModel.Features.Add(new GridFiltering() { Type = OpType.Remote, Inherit = true, Persist = false }); gridModel.Features.Add(new GridSorting() { Type = OpType.Remote, Inherit = true, Persist = false }); gridModel.Features.Add(new GridSummaries() { Type = OpType.Remote, Inherit = true }); gridModel.Features.Add(new GridPaging() { Type = OpType.Remote, Inherit = true , PageSize = 5}); gridModel.Features.Add(new GridResponsive() { EnableVerticalRendering = false, ColumnSettings = new List<ResponsiveColumnSetting>() { new ResponsiveColumnSetting() { ColumnKey = "ID", Classes = "ui-hidden-phone" }, new ResponsiveColumnSetting() { ColumnKey = "Description", Classes = "ui-hidden-phone" } } }); return gridModel; } private GridModel GridLoadOnDemandModel() { // Define the Categories layout GridModel grid = new GridModel(); grid.AutoGenerateLayouts = false; grid.AutoGenerateColumns = false; grid.PrimaryKey = "ID"; grid.Width = "100%"; grid.Columns.Add(new GridColumn() { HeaderText = "カテゴリ ID", Key = "ID", DataType = "number", Width = "0%", Hidden = true}); grid.Columns.Add(new GridColumn() { HeaderText = "カテゴリ名", Key = "CategoryName", DataType = "string", Width = "30%" }); grid.Columns.Add(new GridColumn() { HeaderText = "説明", Key = "Description", DataType = "string", Width = "50%" }); grid.Columns.Add(new GridColumn() { HeaderText = "製品数", Key = "ProductCount", DataType = "number", Width = "20%" }); // Define the Products layout GridColumnLayoutModel layout = new GridColumnLayoutModel(); layout.Key = "Products"; layout.ForeignKey = "CategoryID"; layout.PrimaryKey = "ID"; layout.AutoGenerateColumns = false; layout.Columns.Add(new GridColumn() { HeaderText = "製品 ID", Key = "ID", DataType = "number", Width = "0%", Hidden = true }); layout.Columns.Add(new GridColumn() { HeaderText = "カテゴリ ID", Key = "CategoryID", DataType = "number",Width = "0%", Hidden = true}); layout.Columns.Add(new GridColumn() { HeaderText = "製品名", Key = "ProductName", DataType = "string",Width = "40%"}); layout.Columns.Add(new GridColumn() { HeaderText = "単価", Key = "UnitPrice", DataType = "number", Width = "30%" }); layout.Columns.Add(new GridColumn() { HeaderText = "在庫数", Key = "UnitsInStock", DataType = "number", Width = "30%" }); layout.Width = "100%"; grid.ColumnLayouts.Add(layout); GridPaging paging = new GridPaging(); paging.Type = OpType.Remote; paging.Inherit = true; paging.PageSize = 5; grid.Features.Add(paging); return grid; } #endregion // Grid Models #region Layouts private GridColumnLayoutModel GetProductsLayout() { GridColumnLayoutModel layout = new GridColumnLayoutModel(); layout.Key = "Products"; layout.PrimaryKey = "ID"; layout.ForeignKey = "CategoryID"; layout.Width = "100%"; layout.AutoGenerateColumns = false; //layout.AutofitLastColumn = false; layout.Columns = new List<GridColumn>(); layout.Columns.Add(new GridColumn() { HeaderText = "製品 ID", Key = "ID", DataType = "number", Width = "15%" }); layout.Columns.Add(new GridColumn() { HeaderText = "製品名", Key = "ProductName", DataType = "string", Width = "20%"}); layout.Columns.Add(new GridColumn() { HeaderText = "単価", Key = "UnitPrice", DataType = "number", Width = "15%"}); layout.Columns.Add(new GridColumn() { HeaderText = "在庫数", Key = "UnitsInStock", DataType = "number", Width = "15%"}); layout.Columns.Add(new GridColumn() { HeaderText = "カテゴリ ID", Key = "CategoryID", DataType = "number", Width = "0%", Hidden = true }); layout.Columns.Add(new GridColumn() { HeaderText = "製造中止", Key = "Discontinued", DataType = "bool", Width = "15%" }); layout.DataSourceUrl = this.Url.Action("GetProductsData"); layout.Features.Add(new GridResponsive() { EnableVerticalRendering = false, ColumnSettings = new List<ResponsiveColumnSetting>() { new ResponsiveColumnSetting() { ColumnKey = "ID", Classes = "ui-hidden-phone ui-hidden-tablet" }, new ResponsiveColumnSetting() { ColumnKey = "UnitsInStock", Classes = "ui-hidden-phone ui-hidden-tablet" }, new ResponsiveColumnSetting() { ColumnKey = "UnitPrice", Classes = "ui-hidden-phone ui-hidden-tablet" } } }); return layout; } #endregion // Layouts #region DataSourceUrls public JsonResult GetCategoriesData() { GridModel model = GetGridModel(); return model.GetData(); } public JsonResult GetProductsData(string path, string layout) { GridModel gridModel = GetGridModel(); gridModel.DataSource = RepositoryFactory.GetProductRepository().Get(); return gridModel.GetData(path, layout); } public JsonResult BindParent() { GridModel model = GridLoadOnDemandModel(); model.DataSource = RepositoryFactory.GetCategoryRepository().Get(); return model.GetData(); } public JsonResult BindChild(string path, string layout) { GridModel model = GridLoadOnDemandModel(); model.DataSource = RepositoryFactory.GetProductRepository().Get(); return model.GetData(path, layout); } #endregion // DataSourceUrls #region SampleData private DataSet CategoriesProducts { get { if (Session["CategoriesProducts"] == null) { Session["CategoriesProducts"] = GetCategoriesProductDataSet(); } return (DataSet)Session["CategoriesProducts"]; } } private DataSet GetCategoriesProductDataSet() { DataSet ds = new DataSet("CategoriesProductRecords"); // Get the tables to use in the DataSet DataTable categories = this.GetCategoriesDataTable(); DataTable products = this.GetProductsDataTable(); // Add the tables to the DataSet ds.Tables.Add(categories); ds.Tables.Add(products); // Create the relationship between the tables. ds.Relations.Add("CategoryProductRel", categories.Columns["ID"], products.Columns["CategoryID"]); return ds; } private DataTable GetCategoriesDataTable() { string connString = new NorthwindContext().Database.Connection.ConnectionString; string selectCategoriesStmt = "Select CategoryID as ID, CategoryName, Description from Categories"; SqlDataAdapter da = new SqlDataAdapter(selectCategoriesStmt, connString); DataTable dtData = new DataTable("Categories"); da.Fill(dtData); dtData.PrimaryKey = new DataColumn[] { dtData.Columns["ID"] }; return dtData; } private DataTable GetProductsDataTable() { string connString = new NorthwindContext().Database.Connection.ConnectionString; string selectProductsStmt = "Select ProductID as ID, ProductName, CategoryID, UnitPrice, UnitsInStock, Discontinued from Products"; SqlDataAdapter da = new SqlDataAdapter(selectProductsStmt, connString); DataTable dtData = new DataTable("Products"); da.Fill(dtData); dtData.PrimaryKey = new DataColumn[] { dtData.Columns["ID"] }; return dtData; } #endregion SampleData } }