This example demonstrates how to pass an editor's value to the server in batch edit mode, validate the value based on a condition, and pass the validation result to the client.
Overview
Create the Grid View control and add a callback control to the page. For particular grid columns, specify their edit settings and handle client-side TextChanged events. In the handler, get an editor's value and call the callback's PerformCallback method to pass the value to the server.
JavaScriptvar editor;
function OnTextChanged(s, e) {
editor = s;
clb.PerformCallback(fieldName + '|' + s.GetText());
// ...
}
ASPx<dx:ASPxGridView ID="Grid" ClientInstanceName="grid" runat="server" KeyFieldName="ID" ... >
<Columns>
<!-- ... -->
<dx:GridViewDataTextColumn FieldName="C3">
<PropertiesTextEdit>
<ClientSideEvents TextChanged="OnTextChanged" KeyDown="OnKeyDown" />
<!-- ... -->
</PropertiesTextEdit>
</dx:GridViewDataTextColumn>
<!-- ... -->
</Columns>
<SettingsEditing Mode="Batch" />
</dx:ASPxGridView>
<dx:ASPxCallback ID="ASPxCallback1" runat="server" ClientInstanceName="clb" OnCallback="ASPxCallback1_Callback">
<ClientSideEvents CallbackComplete="OnCallbackComplete" />
</dx:ASPxCallback>
Handle the callback's server-side Callback event. In the handler, specify error text strings for invalid cells based on a condition and save these text strings to the e.Result argument property. Then pass the result to the callback's client-side CallbackComplete event to complete validation on the client.
JavaScriptvar isError = false;
function OnCallbackComplete(s, e) {
// ...
if (e.result != null) {
grid.batchEditApi.StartEdit(currentIndex, grid.GetColumnByField(fieldName).index);
editor.SetIsValid(false);
editor.SetErrorText(e.result);
isError = true;
}
else
isError = false;
}
C#protected void ASPxCallback1_Callback(object source, DevExpress.Web.CallbackEventArgs e) {
string[] parameters = e.Parameter.Split('|');
switch (parameters[0]) {
case "C3":
if (parameters[1] == "AAA")
e.Result = string.Format("'{0}' is invalid value", parameters[1]);
break;
case "C5":
if (parameters[1] == "BBB")
e.Result = string.Format("'{0}' is invalid value", parameters[1]);
break;
default:
break;
}
// ...
}
Files to Review
- Default.aspx (VB: Default.aspx)
- Default.aspx.cs (VB: Default.aspx.vb)
Documentation
Example Code
Default.aspx
ASPx<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="DevExpress.Web.v16.1, Version=16.1.17.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web" TagPrefix="dx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
var fieldName;
var currentIndex;
var keyCode;
function OnBatchEditStartEditing(s, e) {
if (keyCode == 9) {
keyCode = null;
s.batchEditApi.StartEdit(currentIndex, grid.GetColumnByField(fieldName).index);
e.cancel = true;
}
else {
if (!isError) {
fieldName = e.focusedColumn.fieldName;
currentIndex = e.visibleIndex;
}
else {
if (fieldName != e.focusedColumn.fieldName && currentIndex != e.visibleIndex)
e.cancel = true;
}
}
}
var editor;
function OnTextChanged(s, e) {
editor = s;
clb.PerformCallback(fieldName + '|' + s.GetText());
lp.Show();
}
var isError = false;
function OnCallbackComplete(s, e) {
lp.Hide();
if (e.result != null) {
grid.batchEditApi.StartEdit(currentIndex, grid.GetColumnByField(fieldName).index);
editor.SetIsValid(false);
editor.SetErrorText(e.result);
isError = true;
}
else
isError = false;
}
function OnBatchEditEndEditing(s, e) {
e.cancel = (isError || clb.InCallback());
}
function OnKeyDown(s, e) {
keyCode = ASPxClientUtils.GetKeyCode(e.htmlEvent);
}
</script>
</head>
<body>
<form id="frmMain" runat="server">
<dx:ASPxLoadingPanel ID="ASPxLoadingPanel1" runat="server" ClientInstanceName="lp" Modal="true" Text="Checking value on the server side..."></dx:ASPxLoadingPanel>
<dx:ASPxGridView ID="Grid" ClientInstanceName="grid" runat="server" KeyFieldName="ID" OnBatchUpdate="Grid_BatchUpdate"
OnRowInserting="Grid_RowInserting" OnRowUpdating="Grid_RowUpdating" OnRowDeleting="Grid_RowDeleting" OnCellEditorInitialize="Grid_CellEditorInitialize">
<ClientSideEvents BatchEditStartEditing="OnBatchEditStartEditing" BatchEditEndEditing="OnBatchEditEndEditing" />
<Columns>
<dx:GridViewCommandColumn ShowNewButtonInHeader="true" ShowDeleteButton="true" />
<dx:GridViewDataColumn FieldName="C1" />
<dx:GridViewDataSpinEditColumn FieldName="C2" />
<dx:GridViewDataTextColumn FieldName="C3">
<PropertiesTextEdit>
<ClientSideEvents TextChanged="OnTextChanged" KeyDown="OnKeyDown" />
<ValidationSettings CausesValidation="true" EnableCustomValidation="true"></ValidationSettings>
</PropertiesTextEdit>
</dx:GridViewDataTextColumn>
<dx:GridViewDataCheckColumn FieldName="C4" />
<dx:GridViewDataTextColumn FieldName="C5">
<PropertiesTextEdit>
<ClientSideEvents TextChanged="OnTextChanged" KeyDown="OnKeyDown" />
<ValidationSettings CausesValidation="true" EnableCustomValidation="true"></ValidationSettings>
</PropertiesTextEdit>
</dx:GridViewDataTextColumn>
</Columns>
<SettingsEditing Mode="Batch" />
</dx:ASPxGridView>
<dx:ASPxCallback ID="ASPxCallback1" runat="server" ClientInstanceName="clb" OnCallback="ASPxCallback1_Callback">
<ClientSideEvents CallbackComplete="OnCallbackComplete" />
</dx:ASPxCallback>
</form>
</body>
</html>
Default.aspx.cs
C#using System;
using System.Collections.Generic;
using System.Collections.Specialized;
using System.ComponentModel;
using System.Linq;
using DevExpress.Web.Data;
using DevExpress.Web;
using System.Threading;
public partial class _Default : System.Web.UI.Page
{
protected List<GridDataItem> GridData
{
get
{
var key = "34FAA431-CF79-4869-9488-93F6AAE81263";
if (!IsPostBack || Session[key] == null)
Session[key] = Enumerable.Range(0, 100).Select(i => new GridDataItem
{
ID = i,
C1 = i % 2,
C2 = i * 0.5 % 3,
C3 = "C3 " + i,
C4 = i % 2 == 0,
C5 = "C5 " + i
}).ToList();
return (List<GridDataItem>)Session[key];
}
}
protected void Page_Load(object sender, EventArgs e)
{
Grid.DataSource = GridData;
Grid.DataBind();
}
protected void Grid_RowInserting(object sender, ASPxDataInsertingEventArgs e)
{
InsertNewItem(e.NewValues);
CancelEditing(e);
}
protected void Grid_RowUpdating(object sender, ASPxDataUpdatingEventArgs e)
{
UpdateItem(e.Keys, e.NewValues);
CancelEditing(e);
}
protected void Grid_RowDeleting(object sender, ASPxDataDeletingEventArgs e)
{
DeleteItem(e.Keys, e.Values);
CancelEditing(e);
}
protected void Grid_BatchUpdate(object sender, ASPxDataBatchUpdateEventArgs e)
{
foreach (var args in e.InsertValues)
InsertNewItem(args.NewValues);
foreach (var args in e.UpdateValues)
UpdateItem(args.Keys, args.NewValues);
foreach (var args in e.DeleteValues)
DeleteItem(args.Keys, args.Values);
e.Handled = true;
}
protected GridDataItem InsertNewItem(OrderedDictionary newValues)
{
var item = new GridDataItem() { ID = GridData.Count };
LoadNewValues(item, newValues);
GridData.Add(item);
return item;
}
protected GridDataItem UpdateItem(OrderedDictionary keys, OrderedDictionary newValues)
{
var id = Convert.ToInt32(keys["ID"]);
var item = GridData.First(i => i.ID == id);
LoadNewValues(item, newValues);
return item;
}
protected GridDataItem DeleteItem(OrderedDictionary keys, OrderedDictionary values)
{
var id = Convert.ToInt32(keys["ID"]);
var item = GridData.First(i => i.ID == id);
GridData.Remove(item);
return item;
}
protected void LoadNewValues(GridDataItem item, OrderedDictionary values)
{
item.C1 = Convert.ToInt32(values["C1"]);
item.C2 = Convert.ToDouble(values["C2"]);
item.C3 = Convert.ToString(values["C3"]);
item.C4 = Convert.ToBoolean(values["C4"]);
item.C5 = Convert.ToString(values["C5"]);
}
protected void CancelEditing(CancelEventArgs e)
{
e.Cancel = true;
Grid.CancelEdit();
}
public class GridDataItem
{
public int ID { get; set; }
public int C1 { get; set; }
public double C2 { get; set; }
public string C3 { get; set; }
public bool C4 { get; set; }
public string C5 { get; set; }
public string C9 { get; set; }
}
protected void ASPxCallback1_Callback(object source, DevExpress.Web.CallbackEventArgs e)
{
string[] parameters = e.Parameter.Split('|');
switch (parameters[0])
{
case "C3":
if (parameters[1] == "AAA")
e.Result = string.Format("'{0}' is invalid value", parameters[1]);
break;
case "C5":
if (parameters[1] == "BBB")
e.Result = string.Format("'{0}' is invalid value", parameters[1]);
break;
default:
break;
}
Thread.Sleep(1000);
}
protected void Grid_CellEditorInitialize(object sender, ASPxGridViewEditorEventArgs e)
{
ASPxEdit editor = (ASPxEdit)e.Editor;
editor.ValidationSettings.Display = Display.Dynamic;
}
}