Hi
I have a Grid, Add/Editing of record is done using EditMode="PopUp"
Inside a FormTemplate I have a MultiColumn ComboBox and a TextBox to enter landline no.
I have ASP.NET customValidator besides Textbox and want to perform client side validation. ( Using JQuery ? )
It should check that First two characters entered in landlineno Textbox matches with CityCode Column used in ComboBox Template.
<telerik:RadGrid ID="RadGrid1" >
....
<MasterTableView EditMode="PopUp" >
....
<EditFormSettings PopUpSettings-Modal="true" >
....
<FormTemplate >
......
.....
<telerik:RadComboBox ID="RadComboBox2" Runat="server" TabIndex="3"
DropDownWidth="320px"
HighlightTemplatedItems="true"
DataSourceID="EDSStateList" DataTextField="StateName"
DataValueField="StateCode" SelectedValue='<%# Bind("FK_StateCode") %>'>
<HeaderTemplate>
<ul>
<li class="col1">StateName</li>
<li class="col2">CityName</li>
<li class="col3">CityCode</li>
</ul>
</HeaderTemplate>
<ItemTemplate>
<ul>
<li class="col1">
<%# DataBinder.Eval(Container.DataItem, "StateName")%></li>
<li class="col2">
<%# DataBinder.Eval(Container.DataItem, "CityName")%></li>
<li class="col3">
<%# DataBinder.Eval(Container.DataItem, "CityCode") %></li>
</ul>
</ItemTemplate>
<FooterTemplate>
</FooterTemplate>
</telerik:RadComboBox>
.....
....
....
<FormTemplate >
-JD
<asp:LinkButton runat="server" ID="Label2" Text='<%# Eval("News_Title")%>' Font-Bold="true" Font-Names="Tahoma" Font-Size="Small" OnClientClick="javascript:RowDblClick();"> </asp:LinkButton><telerik:RadWindowManager ID="RadWindowManager2" runat="server" Skin="Black"> <Windows> <telerik:RadWindow ID="GetContactUsWindow" runat="server" Title="تعليقات" Modal="true" ReloadOnShow="true" Width="750px" Height="750px" Animation="Fade" AutoSize="true" > </telerik:RadWindow> </Windows> </telerik:RadWindowManager>function RowDblClick(sender, eventArgs) { $find('<%= GetContactUsWindow.ClientID%>').show(); return false; }<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %><style type="text/css"> .style1 { width: 100%; } .style2 { direction: rtl; }</style><telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager><telerik:RadAjaxManager runat="server" ID="RadAjaxManager1" DefaultLoadingPanelID="RadAjaxLoadingPanel1"> <AjaxSettings> <telerik:AjaxSetting AjaxControlID="RadGrid1"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="RadGrid1" /> <telerik:AjaxUpdatedControl ControlID="RadWindowManager1" /> </UpdatedControls> </telerik:AjaxSetting> </AjaxSettings></telerik:RadAjaxManager><telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default"></telerik:RadAjaxLoadingPanel><telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" HorizontalAlign="NotSet" LoadingPanelID="RadAjaxLoadingPanel1"> <telerik:RadGrid ID="RadGrid1" DataSourceID="SqlDataSource1" runat="server" GridLines="None" CellSpacing="0" AutoGenerateColumns="False" Style="direction: rtl" OnPreRender="RadGrid1_PreRender"> <MasterTableView TableLayout="Fixed" DataKeyNames="News_ID" DataSourceID="SqlDataSource1" Width="1000px"> <ItemTemplate> <table class="style1"> <tr> <td class="style2"> <asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("NewsCategory_AvatarPath")%>' Width="30%" Height="30%" /> </td> </tr> <tr> <td class="style2"> <asp:Label runat="server" ID="lblNewsTitle" Text='<%# Eval("News_Title")%>' Font-Bold="true" Font-Names="Tahoma" Font-Size="Small"></asp:Label> </td> </tr> <tr> <td class="style2"> <asp:Label runat="server" ID="lblNewsText" Text='<%# Eval("News_Text")%>' Font-Bold="false" Font-Names="Tahoma" Font-Size="Small"></asp:Label> </td> </tr> <tr> <td class="style2"> <asp:Label runat="server" ID="lblNewsDate" Text='<%# Eval("News_Date")%>' Font-Bold="false" Font-Names="Tahoma" Font-Size="X-Small"></asp:Label> <asp:Label runat="server" ID="lblNewsTime" Text='<%# Eval("News_Time")%>' Font-Bold="false" Font-Names="Tahoma" Font-Size="X-Small"></asp:Label> </td> </tr> </table> </ItemTemplate> <CommandItemSettings ExportToPdfText="Export to PDF" /> <RowIndicatorColumn FilterControlAltText="Filter RowIndicator column"> </RowIndicatorColumn> <ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column"> </ExpandCollapseColumn> <Columns> <telerik:GridBoundColumn DataField="News_Title" FilterControlAltText="Filter News_Title column" HeaderText="أخبار شبكة شام" HeaderStyle-Font-Bold="false" HeaderStyle-Font-Names="Tahoma" HeaderStyle-Font-Size="Small" SortExpression="News_Title" UniqueName="News_Title"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="News_Text" FilterControlAltText="Filter News_Text column" SortExpression="News_Text" UniqueName="News_Text"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="News_Date" FilterControlAltText="Filter News_Date column" SortExpression="News_Date" UniqueName="News_Date"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="News_Time" FilterControlAltText="Filter News_Time column" SortExpression="News_Time" UniqueName="News_Time"> </telerik:GridBoundColumn> </Columns> <DetailTables> <telerik:GridTableView CommandItemDisplay="Bottom" DataKeyNames="News_Notes.Note_ID, News_Notes.News_ID" Width="100%" DataSourceID="SqlDataSource2" AllowAutomaticInserts="true" > <ParentTableRelation> <telerik:GridRelationFields DetailKeyField="News_Notes.News_ID" MasterKeyField="News.News_ID" /> </ParentTableRelation> <ItemTemplate> <table class="style1"> <tr> <td class="style2"> <asp:Label runat="server" ID="lblNewsTitle" Text='<%# Eval("User_Name")%>' Font-Bold="false" Font-Names="Tahoma" Font-Size="Small"></asp:Label> </td> </tr> <tr> <td class="style2"> <asp:Label runat="server" ID="lblNewsText" Text='<%# Eval("Note_Text")%>' Font-Bold="false" Font-Names="Tahoma" Font-Size="Small"></asp:Label> </td> </tr> <tr> <td class="style2"> <asp:Label runat="server" ID="lblNewsDate" Text='<%# Eval("Note_Date")%>' Font-Bold="false" Font-Names="Tahoma" Font-Size="Small"></asp:Label> </td> </tr> </table> </ItemTemplate> <Columns> <telerik:GridBoundColumn DataField="Note_ID" DataType="System.Int32" FilterControlAltText="Filter Note_ID column" HeaderText="التعليقات" ReadOnly="True" SortExpression="Note_ID" UniqueName="Note_ID" HeaderStyle-Font-Bold="false" HeaderStyle-Font-Names="Tahoma" HeaderStyle-Font-Size="Small"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="Note_Text" FilterControlAltText="Filter Note_Text column" SortExpression="Note_Text" UniqueName="Note_Text"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="Note_Date" DataType="System.DateTime" FilterControlAltText="Filter Note_Date column" SortExpression="Note_Date" UniqueName="Note_Date"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="User_Name" FilterControlAltText="Filter User_Name column" SortExpression="User_Name" UniqueName="User_Name"> </telerik:GridBoundColumn> </Columns> </telerik:GridTableView> </DetailTables> </NestedViewTemplate> <EditFormSettings> <EditColumn FilterControlAltText="Filter EditCommandColumn column"> </EditColumn> </EditFormSettings> </MasterTableView> <FilterMenu EnableImageSprites="False"> </FilterMenu> <HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default"> </HeaderContextMenu> </telerik:RadGrid></telerik:RadAjaxPanel><telerik:RadWindowManager ID="RadWindowManager1" runat="server" /><asp:SqlDataSource ID="SqlDataSource1" runat="server" SelectCommand="SELECT News.News_ID, News.News_CategoryID, News.News_AdminID, News.News_Title, News.News_Text, News.News_Date, News.News_Time, News.News_FlagIsActive, NewsCategories.NewsCategory_ID, NewsCategories.NewsCategory_AvatarPath FROM News INNER JOIN NewsCategories ON News.News_CategoryID = NewsCategories.NewsCategory_IDWHERE News.News_FlagIsActive='True'Order BY News.News_ID DESC"></asp:SqlDataSource><asp:SqlDataSource ID="SqlDataSource2" runat="server" SelectCommand="SELECT News_Notes.Note_ID, News_Notes.News_ID, News_Notes.User_ID, News_Notes.Note_Text, News_Notes.Note_Date, News_Notes.Note_Flag, UsersTable.User_ID AS Expr1, UsersTable.User_Name FROM News_Notes INNER JOIN UsersTable ON News_Notes.User_ID = UsersTable.User_IDWHERE News_Notes.Note_Flag = 'True'Order BY News_Notes.Note_Date "></asp:SqlDataSource>var assignedToCol = new AssignedToCustomBoundFilteringColumn();assignedToCol.DataField = "AssessmentManagerUser.FullName";assignedToCol.HeaderText = "Assigned To"; assignedToCol.UniqueName = "AssignedTo";assignedToCol.SortExpression = "AssessmentManagerUser.FullName";PlaApplicationsGrid.MasterTableView.Columns.Add(assignedToCol);private class AssignedToCustomBoundFilteringColumn : GridBoundColumn{ protected override void SetupFilterControls(TableCell cell) { RadComboBox rcBox = new RadComboBox(); rcBox.ID = "AssignedToFilterDropDownList"; rcBox.AutoPostBack = true; rcBox.DataTextField = "FullName"; rcBox.DataValueField = "FullName"; rcBox.SelectedIndexChanged += rcBox_SelectedIndexChanged; rcBox.ItemDataBound += new RadComboBoxItemEventHandler(rcBox_ItemDataBound); var plaOfficers = ApplicationUserManager.Instance.GetBySecurityRoles(new string[] { KnownRoleNames.PLAOfficer }) as List<ApplicationUser>; var unassignedUser = ApplicationUserManager.Instance.GetUnassigned(); ApplicationUser tempEmptyUser = new ApplicationUser(); tempEmptyUser.Person = new Person(); tempEmptyUser.Person.FirstName = "empty"; tempEmptyUser.Person.Surname = ""; plaOfficers.Insert(0, unassignedUser); plaOfficers.Insert(0, tempEmptyUser); rcBox.DataSource = plaOfficers; rcBox.DataBind(); //rcBox.Items[0].Text = "Unassigned"; cell.Controls.Add(rcBox); } private void rcBox_ItemDataBound(object sender, RadComboBoxItemEventArgs e) { // Need this unless you want the item text to say "Unassignred Unassigned" if (e.Item.Text == ApplicationUserManager.Instance.GetUnassigned().FullName) { e.Item.Text = ApplicationUserManager.Instance.GetUnassigned().Username; } else if (e.Item.Text == "empty ") { e.Item.Text = " "; } } protected override void SetCurrentFilterValueToControl(TableCell cell) { if (!(this.CurrentFilterValue == "")) { ((RadComboBox)cell.Controls[0]).Items.FindItemByValue(this.CurrentFilterValue).Selected = true; } } protected override string GetCurrentFilterValueFromControl(TableCell cell) { string currentValue = ((RadComboBox)cell.Controls[0]).SelectedItem.Value; this.CurrentFilterFunction = (currentValue != "" && currentValue != "empty ") ? GridKnownFunction.EqualTo : GridKnownFunction.NoFilter; return currentValue; } private void rcBox_SelectedIndexChanged(object sender, Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs e) { ((GridFilteringItem)(((RadComboBox)sender).Parent.Parent)).FireCommandEvent("Filter", new Pair()); }}var stateCol = new StateCustomBoundFilteringColumn(); // AssignedTo column filtering breaks when this column is introduced//var stateCol = new GridBoundColumn();stateCol.DataField = "State.Description";stateCol.HeaderText = "State";stateCol.UniqueName = "State";stateCol.SortExpression = "State.Description";PlaApplicationsGrid.MasterTableView.Columns.Add(stateCol);private class StateCustomBoundFilteringColumn : GridBoundColumn{ protected override void SetupFilterControls(TableCell cell) { RadComboBox rcBox = new RadComboBox(); rcBox.ID = "StateFilterDropDownList"; rcBox.AutoPostBack = true; rcBox.DataTextField = "Description"; rcBox.DataValueField = "Name"; rcBox.SelectedIndexChanged += rcBox_SelectedIndexChanged; var validStates = ApplicationStateManager.Instance.GetAllMasterBuildStates(); ApplicationState tempEmptyState = new ApplicationState(); tempEmptyState.Name = "empty"; tempEmptyState.Description = ""; validStates.Insert(0, tempEmptyState); rcBox.DataSource = validStates; rcBox.DataBind(); //rcBox.Items[0].Text = "Unassigned"; cell.Controls.Add(rcBox); } protected override void SetCurrentFilterValueToControl(TableCell cell) { if (!(this.CurrentFilterValue == "")) { ((RadComboBox)cell.Controls[0]).Items.FindItemByValue(this.CurrentFilterValue).Selected = true; } } protected override string GetCurrentFilterValueFromControl(TableCell cell) { string currentValue = ((RadComboBox)cell.Controls[0]).SelectedItem.Value; this.CurrentFilterFunction = (currentValue != "" && currentValue != "empty ") ? GridKnownFunction.EqualTo : GridKnownFunction.NoFilter; return currentValue; } private void rcBox_SelectedIndexChanged(object sender, Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs e) { ((GridFilteringItem)(((RadComboBox)sender).Parent.Parent)).FireCommandEvent("Filter", new Pair()); }}<body> <form id="form1" runat="server"> <div> <telerik:RadScriptManager ID="RadScriptManager1" Runat="server"> </telerik:RadScriptManager> <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> <br /> <telerik:RadFilter ID="RadFilter1" runat="server" FilterContainerID="RadGrid1" onapplyexpressions="RadFilter1_ApplyExpressions"> <FieldEditors> <telerik:RadFilterTextFieldEditor FieldName="field1" DataType="System.String" /> <telerik:RadFilterTextFieldEditor FieldName="field2" DataType="System.String" /> </FieldEditors> </telerik:RadFilter> <br /> <br /> </div> <telerik:RadGrid ID="RadGrid1" runat="server" CellSpacing="0" GridLines="None" AllowAutomaticInserts="True" DataSourceID="SqlDataSource1" ShowGroupPanel="True"><HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default"></HeaderContextMenu><MasterTableView AutoGenerateColumns="False" DataSourceID="SqlDataSource1" ><CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings><RowIndicatorColumn FilterControlAltText="Filter RowIndicator column"></RowIndicatorColumn><ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column"></ExpandCollapseColumn> <Columns> <telerik:GridBoundColumn DataField="MachineName" FilterControlAltText="Filter MachineName column" HeaderText="MachineName" SortExpression="MachineName" UniqueName="MachineName"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="OperatingSystem" FilterControlAltText="Filter OperatingSystem column" HeaderText="OperatingSystem" SortExpression="OperatingSystem" UniqueName="OperatingSystem"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="Location" FilterControlAltText="Filter Location column" HeaderText="Location" SortExpression="Location" UniqueName="Location"> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="IPAddress" FilterControlAltText="Filter IPAddress column" HeaderText="IPAddress" SortExpression="IPAddress" UniqueName="IPAddress" Visible=false> </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="Site_Name" FilterControlAltText="Filter Site_Name column" HeaderText="Site_Name" SortExpression="Site_Name" UniqueName="Site_Name" > </telerik:GridBoundColumn> <telerik:GridBoundColumn DataField="Status_ID" FilterControlAltText="Filter Status_ID column" HeaderText="Status_ID" SortExpression="Status_ID" UniqueName="Status_ID" Visible=false > </telerik:GridBoundColumn> </Columns><EditFormSettings><EditColumn FilterControlAltText="Filter EditCommandColumn column"></EditColumn></EditFormSettings></MasterTableView> <ClientSettings AllowDragToGroup="True"> <Scrolling AllowScroll="True" UseStaticHeaders="True" /> </ClientSettings><FilterMenu EnableImageSprites="False" DataValueField="Location"></FilterMenu> </telerik:RadGrid> <telerik:RadAjaxManager runat="server"> <AjaxSettings> <telerik:AjaxSetting AjaxControlID="RadGrid1"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="RadGrid1" /> </UpdatedControls> </telerik:AjaxSetting> </AjaxSettings> </telerik:RadAjaxManager> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:sitemgrConnectionString %>" SelectCommand="TELRIK" SelectCommandType="StoredProcedure"> </asp:SqlDataSource> </form></body></html>using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.UI;using System.Web.UI.WebControls;using Telerik.Web.UI;using System.Data;using System.Data.SqlClient;using System.Configuration;public partial class _Default : System.Web.UI.Page { string conStr = ConfigurationManager.ConnectionStrings["conn44"].ConnectionString; protected void Page_Load(object sender, EventArgs e) { RadGrid1.GroupingSettings.CaseSensitive = false; RadGrid1.ShowGroupPanel = true; RadGrid1.ClientSettings.AllowDragToGroup = true; RadFilterTextFieldEditor editor1 = new RadFilterTextFieldEditor(); RadFilter1.FieldEditors.Add(editor1); editor1.FieldName = "field1"; editor1.DataType = typeof(string); editor1.DisplayName = "field1"; RadFilterTextFieldEditor editor2 = new RadFilterTextFieldEditor(); RadFilter1.FieldEditors.Add(editor2); editor2.FieldName = "field2"; editor2.DataType = typeof(string); editor2.DisplayName = "field2"; } protected void RadFilter1_ApplyExpressions(object sender, RadFilterApplyExpressionsEventArgs e) { RadFilterSqlQueryProvider provider = new RadFilterSqlQueryProvider(); provider.ProcessGroup(e.ExpressionRoot); Label1.Text = provider.Result; }}