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

Jquery validation engine not working.

5 Answers 309 Views

General Discussions

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

Lukus asked on 24 Aug 2011, 09:37 PM

I am trying to use a Jquery form validation. The validation works fine with asp input controls but does nothing with telerik controls.

Here is my code:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test2.aspx.cs" Inherits="Rewrite.Images.test2" %>

<%@ 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">

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

<head id="Head1" runat="server">

<link href="../App_Themes/Default/Default.css" rel="stylesheet" type="text/css" />

<script src="../Scripts/jquery-1.6.2.min.js" type="text/javascript"></script>

<script src="../Scripts/jquery-1.6.2.js" type="text/javascript"></script>

<script src="../Scripts/jquery.validationEngine.js" type="text/javascript"></script>

<script src="../Scripts/jquery.validationEngine-en.js" type="text/javascript"></script>

<title></title>

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

<script type="text/javascript">

$(document).ready(function () {

$("#formID").validationEngine();

});

</script>

</telerik:RadScriptBlock>

</head>

<body>

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

<telerik:RadScriptManager ID="ScriptManager" runat="server" />

<div style="padding-top: 300px">

<asp:TextBox ID="txt_First" runat="server" class="validate[required]" /><br />

<asp:TextBox ID="txt_Second" runat="server" class="validate[required]" /><br />

<telerik:RadNumericTextBox ID="txt_Numeric" runat="server" class="validate[required]">

</telerik:RadNumericTextBox><br />

<asp:TextBox ID="txt_Max" runat="server" class="validate[required],max[100]" /><br />

<input type="button" id="btn_Submit" title="Submit" /><br />

<asp:Label ID="lbl_Output" runat="server" Text="" />

</div>

</form>

</body>

</html>

I am not sure if I have to point the telerik controls to the Jquery files that I am using or how.

Thanks for your time.

5 Answers, 1 is accepted

answered on 30 Aug 2011, 08:23 AM

Hello Lukus,

I suppose that the validation engine selects controls by their class. But the class attribute is used by RadControls for their styling. And their internally functionality overrides the value that you have set.

So you need to use "CssClass" property of each control instead of "class" attribute to apply the class correctly.

<telerik:RadNumericTextBox ID="txt_Numeric" runat="server" CssClass="validate[required]">

You can fine more information about styling here:
http://www.telerik.com/help/aspnet-ajax/input-styles.html
http://www.telerik.com/help/aspnet-ajax/input-css-width.html

All the best,
Vasil
the Telerik team

Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>