[CLOSED] textarea with validator
I have a hidden textarea in a formpanel, the textarea is displayed when a checkbox is ticked.
The textarea has a validator attached to it that returns a message if the textarea is blank and the checkbox is ticked.
The validator event is fired when the page loads but it is not called again, for example on blur or when the save button is clicked.
Could you please advise me how to validate the control?
Below is a sample form
Code:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test.aspx.cs" Inherits="Test" %>
<!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 runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager id="rsmMain" runat="server">
</ext:ResourceManager>
<ext:FormPanel AutoScroll="true" id="pnlMain" runat="server" Padding="6">
<topbar>
<ext:toolbar ID="Toolbar8" runat="server">
<Items>
<ext:Button id="btnSave" runat="server" icon="disk" Text="Save" ToolTip="Save Training Application">
</ext:Button>
</Items>
</ext:toolbar>
</topbar>
<Items>
<ext:Container ID="Container13" runat="server" Layout="Form" LabelWidth="220">
<Items>
<ext:CompositeField ID="CompositeField13" runat="server" FieldLabel="Course Fees (inc VAT)" InvalidClass="compositeField">
<Items>
<ext:label runat="server" id="lblFreeCourseLabel" text="Free Course?"></ext:label>
<ext:checkbox runat="server" id="chkFreeCourse">
<Listeners>
<Check Fn="checkFreeCourse" />
</Listeners>
</ext:checkbox>
<ext:label runat="server" id="lblFreeCourseCommentsLabel" text="Free Course Comments:" Hidden="true"></ext:label>
<ext:textarea id="txtFreeCourseComments" width="350px" runat="server" allowblank="true" MaxLength="8000" Validator="validateFreeCourse()" Hidden="true">
</ext:textarea>
</Items>
</ext:CompositeField>
</Items>
</ext:Container>
</Items>
<bottombar>
<ext:StatusBar id="FormStatusBar" runat="server" defaulttext="Ready">
<plugins>
<ext:validationstatus id="trainingApplicationValidationStatus" runat="server" formpanelid="pnlMain" validicon="Accept" erroricon="exclamation"></ext:validationstatus>
</plugins>
</ext:StatusBar>
</bottombar>
</ext:FormPanel>
</form>
</body>
</html>
Code:
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 Test : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
rsmMain.RegisterClientScriptInclude("test", "test.js");
if (chkFreeCourse.Checked == false)
{
lblFreeCourseCommentsLabel.Hide();
txtFreeCourseComments.Hide();
}
else
{
lblFreeCourseCommentsLabel.Show();
txtFreeCourseComments.Show();
}
}
}
}
Code:
function checkFreeCourse(oCheckbox, bChecked) {
if (bChecked) {
lblFreeCourseCommentsLabel.show();
txtFreeCourseComments.show();
}
else {
lblFreeCourseCommentsLabel.hide();
txtFreeCourseComments.hide();
}
}
function validateFreeCourse(zValue) {
if ((chkFreeCourse.getValue() == true) && (txtFreeCourseComments.getValue() == ''))
return "'Free Course'is a required field";
return true;
}
Thank You
RE: [CLOSED] textarea with validator
Hi,
Validator property expects function name
Code:
Validator="validateFreeCourse"
I am not sure why do you expect to run that validator on Save click. You have to check form panel validity manual
Please see the following sample
Code:
<%@ Page Language="C#" %>
<%@ 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 runat="server">
<title></title>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
if (chkFreeCourse.Checked == false)
{
lblFreeCourseCommentsLabel.Hide();
txtFreeCourseComments.Hide();
}
else
{
lblFreeCourseCommentsLabel.Show();
txtFreeCourseComments.Show();
}
}
}
</script>
<script type="text/javascript">
function checkFreeCourse(oCheckbox,bChecked) {
if(bChecked) {
lblFreeCourseCommentsLabel.show();
txtFreeCourseComments.show();
}
else {
lblFreeCourseCommentsLabel.hide();
txtFreeCourseComments.hide();
}
}
function validateFreeCourse(zValue) {
if((chkFreeCourse.getValue()==true)&&(txtFreeCourseComments.getValue()==''))
return "'Free Course'is a required field";
return true;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="rsmMain" runat="server">
</ext:ResourceManager>
<ext:FormPanel AutoScroll="true" ID="pnlMain" runat="server" Padding="6">
<TopBar>
<ext:Toolbar ID="Toolbar8" runat="server">
<Items>
<ext:Button ID="btnSave" runat="server" Icon="disk" Text="Save" ToolTip="Save Training Application">
<Listeners>
<Click Handler="if(pnlMain.isValid()){/*perform saving*/}" />
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<Items>
<ext:Container ID="Container13" runat="server" Layout="Form" LabelWidth="220">
<Items>
<ext:CompositeField ID="CompositeField13" runat="server" FieldLabel="Course Fees (inc VAT)"
InvalidClass="compositeField">
<Items>
<ext:Label runat="server" ID="lblFreeCourseLabel" Text="Free Course?">
</ext:Label>
<ext:Checkbox runat="server" ID="chkFreeCourse">
<Listeners>
<Check Fn="checkFreeCourse" />
</Listeners>
</ext:Checkbox>
<ext:Label runat="server" ID="lblFreeCourseCommentsLabel" Text="Free Course Comments:"
Hidden="true">
</ext:Label>
<ext:TextArea ID="txtFreeCourseComments" Width="350px" runat="server" AllowBlank="true"
MaxLength="8000" Validator="validateFreeCourse" Hidden="true">
</ext:TextArea>
</Items>
</ext:CompositeField>
</Items>
</ext:Container>
</Items>
<BottomBar>
<ext:StatusBar ID="FormStatusBar" runat="server" DefaultText="Ready">
<Plugins>
<ext:ValidationStatus ID="trainingApplicationValidationStatus" runat="server" FormPanelID="pnlMain"
ValidIcon="Accept" ErrorIcon="exclamation">
</ext:ValidationStatus>
</Plugins>
</ext:StatusBar>
</BottomBar>
</ext:FormPanel>
</form>
</body>
</html>
RE: [CLOSED] textarea with validator
Sorry, it was my mistake. i had brackets included in the validator,
Code:
Validator="validateFreeCourse()"
i removed these and the validator works fine.
Thank You
