Datagrid

\\BUTTON COLUMN Public Class ButtonColumn Inherits DataGridColumn Visual Basic Copy Code Private Sub Page_Init(sender As Object, e As EventArgs) ' Create dynamic column to add to Columns collection. Dim AddColumn As New ButtonColumn() AddColumn.HeaderText = "Add Item" AddColumn.Text = "Add" AddColumn.CommandName = "Add" AddColumn.ButtonType = ButtonColumnType.PushButton ' Add column to Columns collection. ItemsGrid.Columns.AddAt(2, AddColumn) End Sub 'Page_Init

JScript

Copy Code

public class ButtonColumn extends DataGridColumn private function Page_Init(sender : Object, e : EventArgs) { // Create dynamic column to add to Columns collection. var AddColumn : ButtonColumn = new ButtonColumn(); AddColumn.HeaderText="Add Item"; AddColumn.Text="Add"; AddColumn.CommandName="Add"; AddColumn.ButtonType = ButtonColumnType.PushButton; // Add column to Columns collection. ItemsGrid.Columns.AddAt(2, AddColumn); } Visual Basic (Declaration) Public Class EditCommandColumn Inherits DataGridColumn <%@ Page Language="VB" AutoEventWireup="True" %> <%@ Import Namespace="System.Data" %> <script runat="server"> ' The Cart and CartView objects temporarily store the data source ' for the DataGrid control while the page is being processed.

Dim Cart As DataTable = New DataTable() Dim CartView As DataView Sub Page_Load(sender As Object, e As EventArgs) ' With a database, use an select query to retrieve the data. Because ' the data source in this example is an in-memory DataTable, retrieve ' the data from session state if it exists; otherwise create the data ' source. GetSource() ' The DataGrid control maintains state between posts to the server; ' it only needs to be bound to a data source the first time the page ' is loaded or when the data source is updated. If Not IsPostBack Then BindGrid() End If End Sub Sub ItemsGrid_Edit(sender As Object, e As DataGridCommandEventArgs) ' Set the EditItemIndex property to the index of the item clicked ' in the DataGrid control to enable editing for that item. Be sure ' to rebind the DateGrid to the data source to refresh the control. ItemsGrid.EditItemIndex = e.Item.ItemIndex BindGrid() End Sub Sub ItemsGrid_Cancel(sender As Object, e As DataGridCommandEventArgs) ' Set the EditItemIndex property to -1 to exit editing mode. ' Be sure to rebind the DateGrid to the data source to refresh ' the control. ItemsGrid.EditItemIndex = -1 BindGrid() End Sub Sub ItemsGrid_Update(sender As Object, e As DataGridCommandEventArgs) ' Retrieve the text boxes that contain the values to update. ' For bound columns, the edited value is stored in a TextBox. ' The TextBox is the 0th control in a cell's Controls collection. ' Each cell in the Cells collection of a DataGrid item represents ' a column in the DataGrid control. Dim qtyText As TextBox = CType(e.Item.Cells(3).Controls(0), TextBox) Dim priceText As TextBox = CType(e.Item.Cells(4).Controls(0), TextBox) ' Retrieve the updated values. Dim item As String = e.Item.Cells(2).Text Dim qty As String = qtyText.Text Dim price As String = priceText.Text Dim dr As DataRow

' With a database, use an update command to update the data. ' Because the data source in this example is an in-memory ' DataTable, delete the old row and replace it with a new one. ' Remove the old entry and clear the row filter. CartView.RowFilter = "Item='" & item & "'" If CartView.Count > 0 Then CartView.Delete(0) End If CartView.RowFilter = "" ' ' ' ' '

*************************************************************** Insert data validation code here. Be sure to validate the values entered by the user before converting to the appropriate data types and updating the data source. ***************************************************************

' Add the new entry. dr = Cart.NewRow() dr(0) = Convert.ToInt32(qty) dr(1) = item ' If necessary, remove the '$' character from the price before ' converting it to a Double. If price.Chars(0) = "$" Then dr(2) = Convert.ToDouble(price.Substring(1)) Else dr(2) = Convert.ToDouble(price) End If Cart.Rows.Add(dr) ' Set the EditItemIndex property to -1 to exit editing mode. ' Be sure to rebind the DateGrid to the data source to refresh ' the control. ItemsGrid.EditItemIndex = -1 BindGrid() End Sub Sub BindGrid() ' Set the data source and bind to the Data Grid control. ItemsGrid.DataSource = CartView ItemsGrid.DataBind() End Sub Sub GetSource() ' For this example, the data source is a DataTable that is stored

' in session state. If the data source does not exist, create it; ' otherwise, load the data. If Session("ShoppingCart") Is Nothing Then ' Create the sample data. Dim dr As DataRow ' Define the columns Cart.Columns.Add(new Cart.Columns.Add(new Cart.Columns.Add(new

of the table. DataColumn("Qty", GetType(Int32))) DataColumn("Item", GetType(String))) DataColumn("Price", GetType(Double)))

' Store the table in session state to persist its values ' between posts to the server. Session("ShoppingCart") = Cart ' Populate the DataTable with sample data. Dim i As Integer For i = 1 To 9 dr = Cart.NewRow() If (i Mod 2) <> 0 Then dr(0) = 2 Else dr(0) = 1 End If dr(1) = "Item " & i.ToString() dr(2) = (1.23 * (i + 1)) Cart.Rows.Add(dr) Next i Else ' Retrieve the sample data from session state. Cart = CType(Session("ShoppingCart"), DataTable) End If ' Create a DataView and specify the field to sort by. CartView = New DataView(Cart) CartView.Sort="Item" Return End Sub Sub ItemsGrid_Command(sender As Object, e As DataGridCommandEventArgs) Select (CType(e.CommandSource, LinkButton)).CommandName Case "Delete"

DeleteItem(e) ' Add other cases here, if there are multiple ButtonColumns in ' the DataGrid control. Case Else ' Do nothing. End Select End Sub Sub DeleteItem(e As DataGridCommandEventArgs) ' e.Item is the table row where the command is raised. For bound ' columns, the value is stored in the Text property of a TableCell. Dim itemCell As TableCell = e.Item.Cells(2) Dim item As String = itemCell.Text ' Remove the selected item from the data source. CartView.RowFilter = "Item='" & item + "'" If CartView.Count > 0 Then CartView.Delete(0) End If CartView.RowFilter = "" ' Rebind the data source to refresh the DataGrid control. BindGrid() End Sub

DataGrid Editing Example

JScript public class EditCommandColumn extends DataGridColumn

C# <%@ Page Language="C#" AutoEventWireup="True" %> <%@ Import Namespace="System.Data" %> <script runat="server"> // The Cart and CartView objects temporarily store the data source // for the DataGrid control while the page is being processed. DataTable Cart = new DataTable(); DataView CartView;

void Page_Load(Object sender, EventArgs e) { // With a database, use an select query to retrieve the data. Because // the data source in this example is an in-memory DataTable, retrieve // the data from session state if it exists; otherwise, create the data // source. GetSource(); // // // if {

The DataGrid control maintains state between posts to the server; it only needs to be bound to a data source the first time the page is loaded or when the data source is updated. (!IsPostBack) BindGrid();

} } void ItemsGrid_Edit(Object sender, DataGridCommandEventArgs e) { // Set the EditItemIndex property to the index of the item clicked // in the DataGrid control to enable editing for that item. Be sure // to rebind the DateGrid to the data source to refresh the control. ItemsGrid.EditItemIndex = e.Item.ItemIndex; BindGrid(); } void ItemsGrid_Cancel(Object sender, DataGridCommandEventArgs e) { // Set the EditItemIndex property to -1 to exit editing mode. // Be sure to rebind the DateGrid to the data source to refresh // the control. ItemsGrid.EditItemIndex = -1; BindGrid(); } void ItemsGrid_Update(Object sender, DataGridCommandEventArgs e) { // Retrieve the text boxes that contain the values to update. // For bound columns, the edited value is stored in a TextBox. // The TextBox is the 0th control in a cell's Controls collection. // Each cell in the Cells collection of a DataGrid item represents // a column in the DataGrid control. TextBox qtyText = (TextBox)e.Item.Cells[3].Controls[0]; TextBox priceText = (TextBox)e.Item.Cells[4].Controls[0]; // Retrieve the updated values. String item = e.Item.Cells[2].Text; String qty = qtyText.Text; String price = priceText.Text;

DataRow dr; // With a database, use an update command to update the data. // Because the data source in this example is an in-memory // DataTable, delete the old row and replace it with a new one. // Remove the old entry and clear the row filter. CartView.RowFilter = "Item='" + item + "'"; if (CartView.Count > 0) { CartView.Delete(0); } CartView.RowFilter = ""; // // // // //

*************************************************************** Insert data validation code here. Be sure to validate the values entered by the user before converting to the appropriate data types and updating the data source. ***************************************************************

// Add the new entry. dr = Cart.NewRow(); dr[0] = Convert.ToInt32(qty); dr[1] = item; // If necessary, remove the '$' character from the price before // converting it to a Double. if(price[0] == '$') { dr[2] = Convert.ToDouble(price.Substring(1)); } else { dr[2] = Convert.ToDouble(price); } Cart.Rows.Add(dr); // Set the EditItemIndex property to -1 to exit editing mode. // Be sure to rebind the DateGrid to the data source to refresh // the control. ItemsGrid.EditItemIndex = -1; BindGrid(); } void BindGrid() { // Set the data source and bind to the Data Grid control. ItemsGrid.DataSource = CartView; ItemsGrid.DataBind(); } void GetSource() {

// For this example, the data source is a DataTable that is stored // in session state. If the data source does not exist, create it; // otherwise, load the data. if (Session["ShoppingCart"] == null) { // Create the sample data. DataRow dr; // Define the columns of the table. Cart.Columns.Add(new DataColumn("Qty", typeof(Int32))); Cart.Columns.Add(new DataColumn("Item", typeof(String))); Cart.Columns.Add(new DataColumn("Price", typeof(Double))); // Store the table in session state to persist its values // between posts to the server. Session["ShoppingCart"] = Cart; // Populate the DataTable with sample data. for (int i = 1; i <= 9; i++) { dr = Cart.NewRow(); if (i % 2 != 0) { dr[0] = 2; } else { dr[0] = 1; } dr[1] = "Item " + i.ToString(); dr[2] = (1.23 * (i + 1)); Cart.Rows.Add(dr); } } else { // Retrieve the sample data from session state. Cart = (DataTable)Session["ShoppingCart"]; } // Create a DataView and specify the field to sort by. CartView = new DataView(Cart); CartView.Sort="Item"; return; } void ItemsGrid_Command(Object sender, DataGridCommandEventArgs e) { switch(((LinkButton)e.CommandSource).CommandName)

{ case "Delete": DeleteItem(e); break; // Add other cases here, if there are multiple ButtonColumns in // the DataGrid control. default: // Do nothing. break; } } void DeleteItem(DataGridCommandEventArgs e) { // e.Item is the table row where the command is raised. For bound // columns, the value is stored in the Text property of a TableCell. TableCell itemCell = e.Item.Cells[2]; string item = itemCell.Text; // Remove the selected item from the data source. CartView.RowFilter = "Item='" + item + "'"; if (CartView.Count > 0) { CartView.Delete(0); } CartView.RowFilter = ""; // Rebind the data source to refresh the DataGrid control. BindGrid(); }

DataGrid Editing Example

Visual Basic (Declaration) Public Class HyperLinkColumn Inherits DataGridColumn <%@ Page Language="VB" AutoEventWireup="True" %> <%@ Import Namespace="System.Data" %> <script runat="server">

Function CreateDataSource() As ICollection Dim dt As DataTable = New DataTable() Dim dr As DataRow Dim i As Integer dt.Columns.Add(New DataColumn("IntegerValue", GetType(Int32))) dt.Columns.Add(New DataColumn("PriceValue", GetType(Double))) For i = 0 to 2 dr = dt.NewRow() dr(0) = i dr(1) = CDbl(i) * 1.23 dt.Rows.Add(dr) Next i Dim dv As DataView = New DataView(dt) Return dv End Function Sub Page_Load(sender As Object, e As EventArgs) MyDataGrid.DataSource = CreateDataSource() MyDataGrid.DataBind() End Sub

HyperLinkColumn Example

DataTextField="PriceValue" DataTextFormatString="{0:c}" Target="_blank"/ rel="nofollow"> <%@ Page Language="VB" AutoEventWireup="True" %> <script runat="server"> Sub Page_Load(sender As Object, e As EventArgs) Label1.Text = "You selected item: " & Request.QueryString("id") End Sub

Details page for DataGrid

C# <%@ Page Language="C#" AutoEventWireup="True" %> <%@ Import Namespace="System.Data" %> <script runat="server"> ICollection CreateDataSource() { DataTable dt = new DataTable(); DataRow dr; dt.Columns.Add(new DataColumn("IntegerValue", typeof(Int32)));

dt.Columns.Add(new DataColumn("PriceValue", typeof(Double))); for (int i = 0; i < 3; i++) { dr = dt.NewRow(); dr[0] = i; dr[1] = (Double)i * 1.23; }

}

dt.Rows.Add(dr);

DataView dv = new DataView(dt); return dv;

void Page_Load(Object sender, EventArgs e) { MyDataGrid.DataSource = CreateDataSource(); MyDataGrid.DataBind(); }

HyperLinkColumn Example

<%@ Page Language="C#" AutoEventWireup="True" %> <script runat="server"> void Page_Load(Object sender, EventArgs e) { Label1.Text = "You selected item: " + Request.QueryString["id"]; }

Details page for DataGrid

Visual Basic (Declaration) Public Class TemplateColumn Inherits DataGridColumn <%@ Page Language="VB" AutoEventWireup="True" %> <%@ Import Namespace="System.Data" %> <script runat="server"> Private Store As DataTable = New DataTable() Private StoreView As DataView Sub Page_Load(sender As Object, e As EventArgs) If IsNothing(Session("StoreData")) Then Dim dr As DataRow Dim i As Integer Store = New DataTable() Store.Columns.Add(New DataColumn("Tax", GetType(String))) Store.Columns.Add(New DataColumn("Item", GetType(String))) Store.Columns.Add(New DataColumn("Price", GetType(String))) Session("StoreData") = Store ' Create sample data. For i = 1 to 4

dr = Store.NewRow() dr(0) = "0.0%" dr(1) = "Item " & i.ToString() dr(2) = (1.23 * (i + 1)).ToString() Store.Rows.Add(dr) Next i Else Store = Session("StoreData") End If StoreView = New DataView(Store) StoreView.Sort="Item" If Not IsPostBack Then BindGrid() End If End Sub Sub MyDataGrid_Edit(sender As Object, e As DataGridCommandEventArgs) MyDataGrid.EditItemIndex = e.Item.ItemIndex BindGrid() End Sub Sub MyDataGrid_Cancel(sender As Object, e As DataGridCommandEventArgs) MyDataGrid.EditItemIndex = -1 BindGrid() End Sub Sub MyDataGrid_Update(sender As Object, e As DataGridCommandEventArgs) ' Get the text box that contains the price to edit. ' For bound columns the edited value is stored in a text box. ' The text box is the first control in the Controls collection. Dim priceText As TextBox = e.Item.Cells(3).Controls(0) ' Get the check box that indicates whether to include tax from the ' TemplateColumn. Notice that in this case, the check box control is ' second control in the Controls collection. Dim taxCheck As CheckBox = e.Item.Cells(2).Controls(1) Dim item As String = e.Item.Cells(1).Text Dim price As String = priceText.Text Dim dr As DataRow ' With a database, use an update command. Since the data source is ' an in-memory DataTable, delete the old row and replace it with a new

one. ' Remove old entry. StoreView.RowFilter = "Item='" & item & "'" If StoreView.Count > 0 Then StoreView.Delete(0) End If StoreView.RowFilter = "" ' Add new entry. dr = Store.NewRow() If taxCheck.Checked Then dr(0) = "8.6%" Else dr(0) = "0.0%" End If dr(1) = item dr(2) = price Store.Rows.Add(dr) MyDataGrid.EditItemIndex = -1 BindGrid() End Sub Sub BindGrid() MyDataGrid.DataSource = StoreView MyDataGrid.DataBind() End Sub

TemplateColumn Example

Tax <EditItemTemplate>

C++ public ref class TemplateColumn : public DataGridColumn <%@ Page Language="C#" AutoEventWireup="True" %> <%@ Import Namespace="System.Data" %> <script runat="server"> DataTable Store = new DataTable();

DataView StoreView; void Page_Load(Object sender, EventArgs e) { if(Session["StoreData"] == null) { DataRow dr; Store = new DataTable(); Store.Columns.Add(new DataColumn("Tax", typeof(String))); Store.Columns.Add(new DataColumn("Item", typeof(String))); Store.Columns.Add(new DataColumn("Price", typeof(String))); Session["StoreData"] = Store; // Create sample data. for (int i = 1; i <= 4; i++) { dr = Store.NewRow(); dr[0] = "0.0%"; dr[1] = "Item " + i.ToString(); dr[2] = (1.23 * (i + 1)).ToString(); }

Store.Rows.Add(dr);

} else Store = (DataTable)Session["StoreData"]; StoreView = new DataView(Store); StoreView.Sort="Item"; if(!IsPostBack) BindGrid(); } void MyDataGrid_Edit(Object sender, DataGridCommandEventArgs e) { MyDataGrid.EditItemIndex = e.Item.ItemIndex; BindGrid(); } void MyDataGrid_Cancel(Object sender, DataGridCommandEventArgs e) { MyDataGrid.EditItemIndex = -1; BindGrid(); } void MyDataGrid_Update(Object sender, DataGridCommandEventArgs e) { // Get the text box that contains the price to edit. // For bound columns the edited value is stored in a text box. // The text box is the first control in the Controls collection. TextBox priceText = (TextBox)e.Item.Cells[3].Controls[0];

// Get the check box that indicates whether to include tax from the // TemplateColumn. Notice that in this case, the check box control is // second control in the Controls collection. CheckBox taxCheck = (CheckBox)e.Item.Cells[2].Controls[1]; String item = e.Item.Cells[1].Text; String price = priceText.Text; DataRow dr; // With a database, use an update command. Since the data source is // an in-memory DataTable, delete the old row and replace it with a new one. // Remove old entry. StoreView.RowFilter = "Item='" + item + "'"; if (StoreView.Count > 0) StoreView.Delete(0); StoreView.RowFilter = ""; // Add new entry. dr = Store.NewRow(); if (taxCheck.Checked) dr[0] = "8.6%"; else dr[0] = "0.0%"; dr[1] = item; dr[2] = price; Store.Rows.Add(dr);

}

MyDataGrid.EditItemIndex = -1; BindGrid();

void BindGrid() { MyDataGrid.DataSource = StoreView; MyDataGrid.DataBind(); }

TemplateColumn Example

Tax <EditItemTemplate>