How to disable validator controls clientside when chk box is chked

M

moondaddy

I have a data entry form for billing address and shipping address and all
fields are required. However, just above the shipping address is a checkbox
titled "Shipping Address Same As Billing Address". When this checkbox is
checked, I would like to disable all the validator controls for the shipping
address fields so the page becomes valid and can be posted. How can this be
done?
 
S

Steven Cheng[MSFT]

Thanks very much for Teemu's informative tech article.

Hi Moondaddy,

I think the tech article provided by Teemu is a very good one discussing on
the detailed infrastructure of the ASP.NET validate controls. And as for
your problem, I think there're two means:
1. If you'd like to enable or disable the validate control by server side
code, you can use a ASP.NET checkbox control and set it as AutoPostBack =
true. Thus, when the checkbox's checked status is changed, we can set the
certain validator controls' Enabled property in the checkbox's server event.

2. If you want to do this at clientside via javascript code. I've read the
tech article mentioned above and found that there're some buildin client
side script functions provide such functions. One is named
ValidatorEnable(val, enable). It takes a client-validator and a Boolean
value. Enables or disables a client validator. Being disabled will stop it
from evaluating and it will always appear valid. So we can use the
function to enable or disable the proper validator controls in the
checkbox's clientside "oncheck" event. Here is a demo page using this
means, you may refer to it if you have anything unclear:

======================aspx page=================
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>Validators</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5">
<script language="javascript">
function setValidation(val)
{
ValidatorEnable(document.getElementById("rfvOne"), val);
ValidatorEnable(document.getElementById("rfvTwo"), val);
ValidatorEnable(document.getElementById("rfvThree"), val);
ValidatorEnable(document.getElementById("rfvFour"), val);
}
</script>
</HEAD>
<body
onload="setValidation(document.getElementById('chkEnableValidation').checked
)">
<form id="Form1" method="post" runat="server">
<table width="100%" align="center">
<tr>
<td>
<asp:TextBox id="txtOne" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="rfvOne" runat="server"
ErrorMessage="txtOne is empty!"
ControlToValidate="txtOne"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
<asp:TextBox id="txtTwo" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="rfvTwo" runat="server"
ErrorMessage="txtTwo is empty!"
ControlToValidate="txtTwo"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
<asp:TextBox id="txtThree" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="rfvThree" runat="server"
ErrorMessage="txtThree is empty!"
ControlToValidate="txtThree"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
<asp:TextBox id="txtFour" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="rfvFour" runat="server"
ErrorMessage="txtFour is empty!"
ControlToValidate="txtFour"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
EnableValidation:<INPUT type="checkbox" id="chkEnableValidation"
CHECKED onclick="setValidation(this.checked)" runat="server">
<asp:Button id="btnPost" runat="server" Text="PostBack"></asp:Button>
</td>
</tr>
</table>
</form>
</body>
</HTML>

==============code behind page class==============
Public Class validator
Inherits System.Web.UI.Page

#Region " Web Form Designer Generated Code "

'This call is required by the Web Form Designer.
<System.Diagnostics.DebuggerStepThrough()> Private Sub
InitializeComponent()

End Sub
Protected WithEvents txtOne As System.Web.UI.WebControls.TextBox
Protected WithEvents rfvOne As
System.Web.UI.WebControls.RequiredFieldValidator
Protected WithEvents txtTwo As System.Web.UI.WebControls.TextBox
Protected WithEvents rfvTwo As
System.Web.UI.WebControls.RequiredFieldValidator
Protected WithEvents txtThree As System.Web.UI.WebControls.TextBox
Protected WithEvents rfvThree As
System.Web.UI.WebControls.RequiredFieldValidator
Protected WithEvents txtFour As System.Web.UI.WebControls.TextBox
Protected WithEvents rfvFour As
System.Web.UI.WebControls.RequiredFieldValidator
Protected WithEvents btnPost As System.Web.UI.WebControls.Button
Protected WithEvents chkEnableValidation As
System.Web.UI.HtmlControls.HtmlInputCheckBox

'NOTE: The following placeholder declaration is required by the Web
Form Designer.
'Do not delete or move it.
Private designerPlaceholderDeclaration As System.Object

Private Sub Page_Init(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles MyBase.Init
'CODEGEN: This method call is required by the Web Form Designer
'Do not modify it using the code editor.
InitializeComponent()
End Sub

#End Region

Private Sub Page_Load(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles MyBase.Load
'Put user code to initialize the page here
End Sub

Private Sub btnPost_Click(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles btnPost.Click
Response.Write("<br>Page is posted back at: " +
DateTime.Now.ToLongTimeString())
End Sub
End Class
===========================================================



Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)

Get Preview at ASP.NET whidbey
http://msdn.microsoft.com/asp.net/whidbey/default.aspx
 
M

moondaddy

That worked good, but now I've added a validation summay control to the page
and would like to disable it and make it go away or come back at the same
time as I do the validation controls. I added it to the code just as the
other validation controls like this:

ValidatorEnable(document.getElementById("vdcSummary"), flgValidate);

but when I do this, it doesnt run or show at all.

Any good recomendations?
 
S

Steven Cheng[MSFT]

Hi Moondday,

I've tested using a ValidateSummary according to your description. And
found that bydefault the ValidateSummary won't show message if the client
validators are enabled because the validators will pop up the error message
first(client validation). However, when disable those validators by uncheck
the checkbox, the page will be postedback and the ValidateSummary will
display serverside validation's validate result message. To avoid this , I
think we can disable the ValidateSummary at serverside(in Page_load since
the page's valiate() method is not called in Page_Load()) when the page is
posted back rather than at clientside. For example:

Private Sub Page_Load(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles MyBase.Load
vsMain.Enabled = chkEnableValidation.Checked
End Sub
'vsMain is the validateSummary control


And below is the modified test page's source:
===================aspx page=======================
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>Validators</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5">
<script language="javascript">
function setValidation(val)
{
ValidatorEnable(document.getElementById("rfvOne"), val);
ValidatorEnable(document.getElementById("rfvTwo"), val);
ValidatorEnable(document.getElementById("rfvThree"), val);
ValidatorEnable(document.getElementById("rfvFour"), val);

}
</script>
</HEAD>
<body
onload="setValidation(document.getElementById('chkEnableValidation').checked
)">
<form id="Form1" method="post" runat="server">
<table width="100%" align="center">
<tr>
<td>
<asp:ValidationSummary id="vsMain"
runat="server"></asp:ValidationSummary></td>
</tr>
<tr>
<td>
<asp:TextBox id="txtOne" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="rfvOne" runat="server"
ErrorMessage="txtOne is empty!"
ControlToValidate="txtOne"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
<asp:TextBox id="txtTwo" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="rfvTwo" runat="server"
ErrorMessage="txtTwo is empty!"
ControlToValidate="txtTwo"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
<asp:TextBox id="txtThree" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="rfvThree" runat="server"
ErrorMessage="txtThree is empty!"
ControlToValidate="txtThree"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
<asp:TextBox id="txtFour" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="rfvFour" runat="server"
ErrorMessage="txtFour is empty!"
ControlToValidate="txtFour"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
EnableValidation:<INPUT type="checkbox" id="chkEnableValidation"
CHECKED onclick="setValidation(this.checked)"
runat="server">
<asp:Button id="btnPost" runat="server" Text="PostBack"></asp:Button>
</td>
</tr>
</table>
</form>
</body>
</HTML>

===============code behind page class===============
Public Class validator
Inherits System.Web.UI.Page

#Region " Web Form Designer Generated Code "

'This call is required by the Web Form Designer.
<System.Diagnostics.DebuggerStepThrough()> Private Sub
InitializeComponent()

End Sub
Protected WithEvents txtOne As System.Web.UI.WebControls.TextBox
Protected WithEvents rfvOne As
System.Web.UI.WebControls.RequiredFieldValidator
Protected WithEvents txtTwo As System.Web.UI.WebControls.TextBox
Protected WithEvents rfvTwo As
System.Web.UI.WebControls.RequiredFieldValidator
Protected WithEvents txtThree As System.Web.UI.WebControls.TextBox
Protected WithEvents rfvThree As
System.Web.UI.WebControls.RequiredFieldValidator
Protected WithEvents txtFour As System.Web.UI.WebControls.TextBox
Protected WithEvents rfvFour As
System.Web.UI.WebControls.RequiredFieldValidator
Protected WithEvents btnPost As System.Web.UI.WebControls.Button
Protected WithEvents chkEnableValidation As
System.Web.UI.HtmlControls.HtmlInputCheckBox
Protected WithEvents vsMain As
System.Web.UI.WebControls.ValidationSummary

'NOTE: The following placeholder declaration is required by the Web
Form Designer.
'Do not delete or move it.
Private designerPlaceholderDeclaration As System.Object

Private Sub Page_Init(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles MyBase.Init
'CODEGEN: This method call is required by the Web Form Designer
'Do not modify it using the code editor.
InitializeComponent()
End Sub

#End Region

Private Sub Page_Load(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles MyBase.Load
'Put user code to initialize the page here
vsMain.Enabled = chkEnableValidation.Checked
End Sub

Private Sub btnPost_Click(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles btnPost.Click
Response.Write("<br>Page is posted back at: " +
DateTime.Now.ToLongTimeString())
Response.Write(Page.IsValid)
End Sub
End Class
=========================================


Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)

Get Preview at ASP.NET whidbey
http://msdn.microsoft.com/asp.net/whidbey/default.aspx
 
P

Peter Blum

You have run into one of the more difficult aspects of ASP.NET validators. I
found a whole bunch of limitations with ASP.NET validators and decided to
build a solid replacement that solves those limitations and greatly expands
what you can do with validation.

My product, "Professional Validation And More" at
http://www.peterblum.com/vam/home.aspx, includes a smart enabling feature on
each validator control. You define the rules you want to enable and disable
the validators. Its easy to have it look at the state of a checkbox with
smart enabling. My ValidationSummary (also greatly enhanced) respects these
rules too. "Professional Validation And More" also includes a control that
can enable and disable a group of other fields as the user clicks on a
checkbox. (Its called the FieldStateController.)

--- Peter Blum
www.PeterBlum.com
Email: (e-mail address removed)
Creator of "Professional Validation And More" at
http://www.peterblum.com/vam/home.aspx
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

CreateUserWizard - Embedded controls 1
need help woth conditional validation controls 1
Clientside Validation and Page.IsValid 1
Help With CheckBox 3
ModalPopupExtender and Required Field Validator 1
Paul's Glavich Dom Validator Controls problem 1
Regular Expression Validator - Server side validation is not working 3
Custom validator and Checkboxes 2

Top