This is a migrated thread and some comments may be shown as answers.

CustomValidator client function fires multiple times after postback.

3 Answers 520 Views

Ajax

This is a migrated thread and some comments may be shown as answers.

Jeff asked on 15 Aug 2012, 03:34 AM

After the postback of the RadGrid in one update panel, the custom validator in another panel fires numerous times. The more postbacks you do on the RadGrid, the more times the validator will fire.

Here is the sample code. Watch "Count: 0" before a postback and after selecting a row or two in the RadGrid.

Before postback, the validator runs once every time you change the textbox or press the button. After selecting a couple of grid rows, it will fire multiple times....

You can execute the validator by changing the text in the text box to anything other than "hello"...

Move the validator out of the ajaxified table and it works as expected...

How can I have the custom validator inside the ajaxified table act properly after postback?

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default2.aspx.cs" Inherits="TestValidation.Default2" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

protected void Page_Load(object sender, EventArgs e)

{

RadGrid1.NeedDataSource += new Telerik.Web.UI.GridNeedDataSourceEventHandler(RadGrid1_NeedDataSource);

}

protected void RadGrid1_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)

{

var items = new List<dynamic>()

{

new { Col1 = "ABC", Col2 = "DEF" },

new { Col1 = "123", Col2 = "456" }

};

RadGrid1.DataSource = items;

}

</script>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

<Scripts>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js">

</asp:ScriptReference>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js">

</asp:ScriptReference>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js">

</asp:ScriptReference>

</Scripts>

</telerik:RadScriptManager>

<telerik:RadGrid ID="RadGrid1" runat="server" Height="100px" Width="400px">

<MasterTableView Name="ChargePaymentTable" TableLayout="Fixed" AutoGenerateColumns="true">

</MasterTableView>

<ClientSettings EnableRowHoverStyle="true" EnablePostBackOnRowClick="true">

<Selecting AllowRowSelect="true" />

</ClientSettings>

</telerik:RadGrid>

<br />

<div id="div1">Count: 0</div>

<%--<div>

<asp:CustomValidator ID="CustomValidator1" runat="server" ControlToValidate="TextBox1"

Text="FORMAT" ValidationGroup="CheckGroup" ClientValidationFunction="CheckText"></asp:CustomValidator>

</div>--%>

<table id="Table1" runat="server">

<tr>

<td>

Hello?

<asp:CustomValidator ID="CustomValidator2" runat="server" ControlToValidate="TextBox1"

Text="FORMAT" ValidationGroup="CheckGroup" ClientValidationFunction="CheckText"></asp:CustomValidator>

</td>

</tr>

<tr>

<td>

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

</td>

</tr>

<tr>

<td>

<asp:Button ID="Button1" runat="server" Text="Check" ValidationGroup="CheckGroup" />

</td>

</tr>

</table>

<telerik:RadAjaxManager runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="Button1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

<telerik:AjaxUpdatedControl ControlID="Table1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">

<script language="javascript" type="text/javascript">

var checkCount = 0;

function CheckText(sender, args) {

$telerik.$("#div1").html("Count: " + ++checkCount);

args.IsValid = (args.Value == "hello");

}

</script>

</telerik:RadScriptBlock>

</form>

</body>

</html>

3 Answers, 1 is accepted

Accepted

answered on 17 Aug 2012, 12:10 PM

Hello Jeff,

Please modify your Ajax settings as it is shown below and see how it works on your end:

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="Table1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

<telerik:AjaxUpdatedControl ControlID="Table1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

Regards,
Milena
the Telerik team

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.