Here is the sample code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ValidationCheck.aspx.cs" Inherits="ValidationCheck" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!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 id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<ext:XScript ID="XScript1" runat="server">
<script>
var topicValues = function (value)
{
var r = #{StoreCombo}.getById(value);
if (Ext.isEmpty(r))
{
return "";
}
return r.data.TopicName;
};
</script>
</ext:XScript>
<ext:ResourceManager ID="rmPrelimIdeas" runat="server" />
<ext:Store ID="StoreCombo" runat="server">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="TopicID">
<Fields>
<ext:ModelField Name="TopicID" />
<ext:ModelField Name="TopicName" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
<ext:GridPanel ID="GridPanel1" runat="server">
<Store>
<ext:Store ID="Store1" runat="server" PageSize="3">
<Model>
<ext:Model ID="Model2" runat="server">
<Fields>
<ext:ModelField Name="TopicID" />
<ext:ModelField Name="TopicName" />
<ext:ModelField Name="ShortDescription"/>
<ext:ModelField Name="LongDescription" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ID="Column4" runat="server" Text="Topic" DataIndex="TopicID" Width="240">
<Renderer Fn="topicValues" />
<Editor>
<ext:ComboBox ID="ComboBox1" runat="server" StoreID="StoreCombo" DisplayField="TopicName"
ValueField="TopicID" />
</Editor>
</ext:Column>
<ext:Column ID="Column1" runat="server" Text="Short Description" DataIndex="ShortDescription"
Flex="1">
<Editor>
<ext:TextField ID="TextField1" runat="server" AllowBlank="false" />
</Editor>
</ext:Column>
</Columns>
</ColumnModel>
<Plugins>
<ext:CellEditing ID="CellEditing1" runat="server">
</ext:CellEditing>
</Plugins>
<SelectionModel>
<ext:CheckboxSelectionModel ID="CheckboxSelectionModel1" runat="server" />
</SelectionModel>
<TopBar>
<ext:Toolbar ID="Toolbar1" runat="server">
<Items>
<ext:Button ID="btnSave" runat="server" Icon="Disk">
<DirectEvents>
<Click OnEvent="btnSave_Click">
<ExtraParams>
<ext:Parameter Name="Values" Value="Ext.encode(#{GridPanel1}.getRowsValues({selectedOnly:true}))"
Mode="Raw" />
</ExtraParams>
</Click>
</DirectEvents>
</ext:Button>
<ext:Button ID="Button1" runat="server" Icon="Add">
<DirectEvents>
<Click OnEvent="btnAdd_Click">
</Click>
</DirectEvents>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
</ext:GridPanel>
</div>
</form>
</body>
</html>
.cs page
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Ext.Net;
public partial class ValidationCheck : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
//DataSource for StoreCombo
List<object> StoreComboData = new List<object>
{
new {TopicID="1",TopicName="Topic1"},
new {TopicID="2",TopicName="Topic2"},
new {TopicID="3",TopicName="Topic3"}
};
StoreCombo.DataSource = StoreComboData;
StoreCombo.DataBind();
//DataSource for GridBox
List<object> gridData = new List<object>
{
new {TopicID = "1", TopicName = "Topic1", ShortDescription="Test1" },
new {TopicID = "3", TopicName = "Topic3", ShortDescription="Test2"}
};
Store1.DataSource = gridData;
Store1.DataBind();
}
}
[DirectMethod]
protected void btnSave_Click(object sender, DirectEventArgs e)
{
string json = e.ExtraParams["Values"];
Dictionary<string, string>[] dctTopics = JSON.Deserialize<Dictionary<string, string>[]>(json);
string strTopicName = string.Empty;
string strTopicDescp = string.Empty;
string strTopicID = string.Empty;
foreach (Dictionary<string, string> row in dctTopics)
{
foreach (KeyValuePair<string, string> keyValuePair in row)
{
if (keyValuePair.Key == "TopicName")
{
strTopicName = keyValuePair.Value;
}
}
}
}
protected void btnAdd_Click(object sender, DirectEventArgs e)
{
List<object> gridData = new List<object>
{
new {TopicID = "1", TopicName = "", ShortDescription="" },
};
this.Store1.Add(gridData);
this.GridPanel1.GetStore().CommitChanges();
}
}
Steps:
1. Try to empty Short Description text box in column and tab out, the validation shows up.
2. Click on Add icon at the top bar on the grid. New row is added.
3. Short Description is already empty and the validation does not show up.
I need to implement a validation if short Descrption is empty and also if Topic combo box is not chosen. Let me know how I can acheive it.
Thanks