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

Problems with using CustomValidator for client-side validation

2 Answers 627 Views

ComboBox

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

Vladimir asked on 07 Mar 2011, 10:44 AM

Hello, I'm trying to implement custom validation for my web page, but having problem. I want my ComboBox to be populated asynchronously from Web Service. So, here's the code of my page:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CBSamplePage.aspx.cs" Inherits="CBSamplePage" %>

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

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

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

<head runat="server">

<title>

RadComboBox Sample Page

</title>

</head>

<body>

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

<script type="text/javascript">

function validatePerson(source, args) {

if ($find("<%=cbPersons.ClientID %>").get_value() > 0) {

args.IsValid = true;

} else {

args.IsValid = false;

}

</script>

<div>

<asp:ScriptManager runat="server" ID="scriptManager1"></asp:ScriptManager>

<table>

<tr>

<td>

<asp:Label runat="server" ID="lbl1">Select something</asp:Label>

</td>

<td>

<telerik:RadComboBox EmptyMessage="Select a person..." runat="server" ID="cbPersons" AllowCustomText="true" EnableLoadOnDemand="true">

<WebServiceSettings Method="GetPersons" Path="~/SampleWebService.asmx" />

</telerik:RadComboBox>

<asp:CustomValidator runat="server" ID="customValrPerson" ValidationGroup="Sample" ControlToValidate="cbPersons" ErrorMessage="Required" ClientValidationFunction="validatePerson"></asp:CustomValidator>

</td>

</tr>

<tr>

<td colspan="2">

<asp:LinkButton runat="server" ID="lnkSubmit" ValidationGroup="Sample" CausesValidation="true">Submit</asp:LinkButton>

</td>

</tr>

</table>

</div>

</form>

</body>

</html>

And here's the code of the web service that I use for generating ComboBox items:

<%@ WebService Language="C#" Class="SampleWebService" %>

using System;

using System.Web;

using System.Web.Services;

using System.Web.Services.Protocols;

using System.Web.Script.Services;

using Telerik.Web.UI;

[WebService(Namespace = "http://tempuri.org/")]

[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

[ScriptService]

public class SampleWebService : System.Web.Services.WebService {

static string[] persons = { "Person Number 1", "Person Number 2", "Person Number 3", "Person Number 4", "Person Number 5" };

[WebMethod]

public RadComboBoxItemData[] GetPersons(RadComboBoxContext context)

{

RadComboBoxItemData[] result = null;

result = new RadComboBoxItemData[persons.Length];

for (int i = 0; i < persons.Length; i++)

{

result[i] = new RadComboBoxItemData { Text = persons[i], Value = i.ToString() };

}

return result;

}

So, I have number of problems.

1) When I load the page and click "Submit" link, validation doesn't happen and page gets post back. Obviously, that's wrong because ComboBox doesn't have any item selected.
2) When I select an item I see "Required" text. That happens because when validation function is called, this code:

$find("<%=cbPersons.ClientID %>").get_value()

returns "undefined". Sure, that's not how I expect things to work. When I click "Submit" link everything works properly.

P.S. It can seem that I would use RequiredFieldValidator in this example, but sometimes I will need to change the way selection is validated, so I would prefer to use CustomValidator for this.

2 Answers, 1 is accepted

answered on 04 Apr 2011, 09:28 AM

Hi broctune,

Please set the ValidateEmptyText property of the CustomValidator to “true”:

<script type="text/javascript">

function validatePerson(source, args) {

if ($find("<%=cbPersons.ClientID %>").get_value() > 0) {

args.IsValid = true;

} else {

args.IsValid = false;

}

</script>

<telerik:RadComboBox EmptyMessage="Select a person..."

runat="server" ID="cbPersons"

AllowCustomText="true" EnableLoadOnDemand="true">

<WebServiceSettings Method="GetPersons"

Path="~/SampleWebService.asmx" />

</telerik:RadComboBox>

<asp:CustomValidator runat="server" ID="customValrPerson"

ValidationGroup="Sample"

ValidateEmptyText="true"

ControlToValidate="cbPersons"

ErrorMessage="Required"

ClientValidationFunction="validatePerson">

</asp:CustomValidator>

Greetings,
Kalina
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items