<%@ Page Title="Grid-Command Column-ASP.NET-SYNCFUSION" Language="C#" MetaDescription="This demo explains how to include CRUD action buttons as one of the columns in Syncfusion ASP.NET Web Forms DataGrid control." MasterPageFile="~/Samplebrowser.Master" AutoEventWireup="true" CodeBehind="CommandColumn.aspx.cs" Inherits="WebSampleBrowser.Grid.CommandColumn" %>
<asp:Content ID="Content1" ContentPlaceHolderID="SampleHeading" runat="server">
<span class="sampleName">Grid / Editing / Command Column</span>
</asp:Content>
<asp:Content ID="ControlContent" runat="server" ContentPlaceHolderID="ControlsSection">
<div>
<ej:Grid ID="OrdersGrid" runat="server" AllowPaging="True" EnableAutoSaveOnSelectionChange="False" EnableRowHover="False"
OnServerEditRow="EditEvents_ServerEditRow" OnServerDeleteRow="EditEvents_ServerDeleteRow">
<ClientSideEvents ActionComplete="complete" EndEdit="endEdit" EndDelete="endDelete" />
<PageSettings PageSize="10"></PageSettings>
<EditSettings AllowDeleting="True" AllowEditing="True" AllowEditOnDblClick="false"></EditSettings>
<Columns>
<ej:Column Field="OrderID" HeaderText="Order ID" IsPrimaryKey="True" TextAlign="Right" Width="75" />
<ej:Column Field="EmployeeID" HeaderText="Employee ID" TextAlign="Right" EditType="NumericEdit" Width="90"/>
<ej:Column Field="Freight" HeaderText="Freight" EditType="NumericEdit" TextAlign="Right" Width="75" Format="{0:C}" >
<NumericEditOptions DecimalPlaces="2"></NumericEditOptions>
</ej:Column>
<ej:Column Field="ShipCity" HeaderText="Ship City" Width="90" />
<ej:Column Field="ShipCountry" HeaderText="Ship Country" Width="90" />
<ej:Column HeaderText="Manage Column" IsUnbound="True" Width="130">
<Command>
<ej:Commands Type="edit">
<ButtonOptions Text="Edit"></ButtonOptions>
</ej:Commands>
<ej:Commands Type="delete">
<ButtonOptions Text="Delete"></ButtonOptions>
</ej:Commands>
<ej:Commands Type="save">
<ButtonOptions Text="Save"></ButtonOptions>
</ej:Commands>
<ej:Commands Type="cancel">
<ButtonOptions Text="Cancel"></ButtonOptions>
</ej:Commands>
</Command>
</ej:Column>
</Columns>
</ej:Grid>
</div>
</asp:Content>
<asp:Content ID="Content5" ContentPlaceHolderID="ScriptSection" runat="server">
<script type="text/javascript">
function endDelete(args) {
$("#OrdersGrid").ejWaitingPopup("show");
}
function endEdit(args) {
$("#OrdersGrid").ejWaitingPopup("show");
}
function complete(args) {
if (args.requestType == "refresh") {
$("#OrdersGrid").ejWaitingPopup("hide");
}
}
</script>
</asp:Content>
using Syncfusion.JavaScript.Web;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebSampleBrowser.Grid
{
public partial class CommandColumn : System.Web.UI.Page
{
List<Orders> order = new List<Orders>();
protected void Page_Load(object sender, EventArgs e)
{
BindDataSource();
Session["CommandColumnDataSource"] = order;
}
private void BindDataSource()
{
if ((List<Orders>)Session["CommandColumnDataSource"] == null)
{
int code = 10000;
for (int i = 1; i < 10; i++)
{
order.Add(new Orders(code + 1, i + 0, 2.3 * i, "Münster", "Germany", false));
order.Add(new Orders(code + 2, i + 2, 3.3 * i, "Rio de Janeiro", "Brazil", true));
order.Add(new Orders(code + 3, i + 1, 4.3 * i, "Lyon", "France", true));
order.Add(new Orders(code + 4, i + 3, 5.3 * i, "Reims", "France", true));
order.Add(new Orders(code + 5, i + 4, 6.3 * i, "Charleroi", "Belgium", false));
code += 5;
}
}
else
{
order = (List<Orders>)Session["CommandColumnDataSource"];
}
this.OrdersGrid.DataSource = order;
this.OrdersGrid.DataBind();
}
protected void EditEvents_ServerEditRow(object sender, GridEventArgs e)
{
EditAction(e.EventType, e.Arguments["data"]);
}
protected void EditEvents_ServerDeleteRow(object sender, GridEventArgs e)
{
EditAction(e.EventType, e.Arguments["data"]);
}
protected void EditAction(string eventType, object record)
{
List<Orders> data = Session["CommandColumnDataSource"] as List<Orders>;
Dictionary<string, object> KeyVal = record as Dictionary<string, object>;
if (eventType == "endEdit")
{
Orders value = new Orders();
foreach (KeyValuePair<string, object> keyval in KeyVal)
{
if (keyval.Key == "OrderID")
{
value = data.Where(d => d.OrderID == (int)keyval.Value).FirstOrDefault();
value.OrderID = Convert.ToInt32(keyval.Value);
}
else if (keyval.Key == "Verified")
value.Verified = Convert.ToBoolean(keyval.Value);
else if (keyval.Key == "EmployeeID")
value.EmployeeID = Convert.ToInt32(keyval.Value);
else if (keyval.Key == "Freight")
value.Freight = Convert.ToDouble(keyval.Value);
else if (keyval.Key == "ShipCountry")
value.ShipCountry = Convert.ToString(keyval.Value);
else if (keyval.Key == "ShipCity")
value.ShipCity = Convert.ToString(keyval.Value);
}
}
else if (eventType == "endDelete")
{
foreach (KeyValuePair<string, object> keyval in KeyVal)
{
if (keyval.Key == "OrderID")
{
Orders value = data.Where(d => d.OrderID == (int)keyval.Value).FirstOrDefault();
data.Remove(value);
}
}
}
Session["CommandColumnDataSource"] = data;
this.OrdersGrid.DataSource = data;
this.OrdersGrid.DataBind();
}
[Serializable]
public class Orders
{
public Orders()
{
}
public Orders(long OrderId, int EmployeeId, double Freight, string ShipCity, string ShipCountry, bool Verified)
{
this.OrderID = OrderId;
this.EmployeeID = EmployeeId;
this.Freight = Freight;
this.ShipCity = ShipCity;
this.ShipCountry = ShipCountry;
this.Verified = Verified;
}
public long OrderID { get; set; }
public int EmployeeID { get; set; }
public double Freight { get; set; }
public string ShipCity { get; set; }
public string ShipCountry { get; set; }
public bool Verified { get; set; }
}
}
}