Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > ASP .Net > Help - client side validation not working, driving me MAD!

Reply
Thread Tools

Help - client side validation not working, driving me MAD!

 
 
Alan Silver
Guest
Posts: n/a
 
      12-05-2005
Hello,

I have some simple client-side Javascript validation that was working
fine until now. For some reason (don't ask me), it has stopped working
and I can't figure out why. I have switched to version 2.0 (from 1.1)
and have changed the page to use a master page, but other than that,
it's the same.

I am trying to validate the from date for a credit card to make sure the
date has already passed. The code is pretty straightforward. I have two
dropdown controls and a custom validator...

<aspropDownList ID="drpFromMonth" RunAt="server">
<asp:ListItem value="01">01/January</asp:ListItem>
.... etc ...
<asp:ListItem value="12">12/December</asp:ListItem>
</aspropDownList>

<aspropDownList ID="drpFromYear" RunAt="server" />

<asp:CustomValidator ControlToValidate="drpFromMonth"
OnServerValidate="ValidateValidFrom"
ClientValidationFunction="ValidateValidFromDate" Display="Dynamic"
ErrorMessage="not valid yet" Text="not valid yet" Runat="Server" />

The values for drpFromYear are set in code. The client-side function
looks like this...

function ValidateValidFromDate(s, e) {
fromMonth = parseInt(document.aspnetForm.drpFromMonth.selected Index);
fromYear = parseInt(document.aspnetForm.drpFromYear.options[document.aspnetForm.drpFromYear.selectedIndex].value);
now = new Date;
nowMonth = now.getMonth();
nowYear = now.getYear();
dateOK = false;
if (fromYear > nowYear) {
dateOK = false;
}
if (fromYear == nowYear) {
if (fromMonth <= nowMonth) {
dateOK = true;
} else {
dateOK = false;
}
}
if (fromYear < nowYear) {
dateOK = true;
}
e.IsValid = dateOK;
}

I originally had document.form1.drpFromMonth in there, which worked.
Since I had this error, I tried changing it to
document.aspnetForm.drpFromMonth as that uses the form name that is
generated by the framework. I tried setting the form's id myself, but it
was ignored. Whatever I did, the generated page had aspnetForm as the
form name and ID. I changed my client-side code to use this, but it
still didn't work.

When I try the page, I get an error...

document.aspnetForm.drpFromMonth.selectedIndex is null or not an object

I have tried various variations, like document.forms[0].drpFromMonth and
document.all["drpFromMonth"], but with the same result.

Anyone any idea how to get this to work? TIA

--
Alan Silver
(anything added below this line is nothing to do with me)
 
Reply With Quote
 
 
 
 
Rajeev Gopal
Guest
Posts: n/a
 
      12-05-2005
Hi Alan,

Can you try RegisterClientScript method, in the Page_Load event?

Thanks,
Rajeev Gopal
www.geekswithblogs.net/rajeevgopal

 
Reply With Quote
 
 
 
 
Alan Silver
Guest
Posts: n/a
 
      12-06-2005
>I have some simple client-side Javascript validation that was working
>fine until now. For some reason (don't ask me), it has stopped working
>and I can't figure out why. I have switched to version 2.0 (from 1.1)
>and have changed the page to use a master page, but other than that,
>it's the same.


OK, I think I have found out the problem more specifically, but haven't
yet found an answer. Maybe if I clarify what's happening, someone may be
able to help.

Consider the following simple (air) code...

</form id="form1" runat="server">
<asp:Textbox id="txtName" runat="server" />
</form>

When used on a normal (master-less) page, the HTML that is emitted looks
something like this...

<form action="http://whatever/page.aspx" method="post">
<input type="text" id="txtName">
</form>

If you now use the same code in a master page, it looks very different.
Specifically, the id of the textbox is *not* the same as the one you
specified, it is something like "ctl00_cphMainBody_txtName", where
"cphMainBody" is the id of the contentplaceholder control in the master
page.

Furthermore, any id you give the form is ignored, and the id is set to
"aspnetForm". This looks like a bug in the framework to me. Sure I can
use "aspnetForm" in my Javascript, but who says that autogenerated name
won't change in another version of the framework? At least when I set
the id, I know what it will be. I can find ways around that (like using
document.forms[0]), but it still leaves the more serious problem...

How do I get a reference to the text box in client-side Javascript? I
can't predict what the text box's id will be. Any client-side validation
that needs to reference a control not passed as a parameter cannot be
referenced.

Anyone any comments? This seems like a major problem with using master
pages. I can see *why* it's happening, but I can't see any way of
getting around it.

--
Alan Silver
(anything added below this line is nothing to do with me)
 
Reply With Quote
 
Alan Silver
Guest
Posts: n/a
 
      12-06-2005
>OK, I think I have found out the problem more specifically, but haven't
>yet found an answer.


<g>Predictably, I found an answer shortly after posting.

http://forums.asp.net/1119696/ShowPost.aspx explains that you need to
use server-side code to write the ClientID of the control into the
Javascript. I found that the code shown there didn't work, but when
changed to...

alert(document.forms[0].<%= txtName.ClientID %>.value);

it worked fine. When the page is rendered, the Javascript looks
something like...

alert(document.forms[0].ctl00_cphMainBody_txtName.value);

which is what I wanted

I still reckon the other issue with the id of the form tag is a bug
though. I would be interested to hear anyone else's opinion on this.

--
Alan Silver
(anything added below this line is nothing to do with me)
 
Reply With Quote
 
Edwin Knoppert
Guest
Posts: n/a
 
      12-06-2005
me.textbox1.clientid

insert it in js in <%= %> tags


"Alan Silver" <alan-> schreef in bericht
news:cjiEIQK+TIlDFw+...
> Hello,
>
> I have some simple client-side Javascript validation that was working fine
> until now. For some reason (don't ask me), it has stopped working and I
> can't figure out why. I have switched to version 2.0 (from 1.1) and have
> changed the page to use a master page, but other than that, it's the same.
>
> I am trying to validate the from date for a credit card to make sure the
> date has already passed. The code is pretty straightforward. I have two
> dropdown controls and a custom validator...
>
> <aspropDownList ID="drpFromMonth" RunAt="server">
> <asp:ListItem value="01">01/January</asp:ListItem>
> ... etc ...
> <asp:ListItem value="12">12/December</asp:ListItem>
> </aspropDownList>
>
> <aspropDownList ID="drpFromYear" RunAt="server" />
>
> <asp:CustomValidator ControlToValidate="drpFromMonth"
> OnServerValidate="ValidateValidFrom"
> ClientValidationFunction="ValidateValidFromDate" Display="Dynamic"
> ErrorMessage="not valid yet" Text="not valid yet" Runat="Server" />
>
> The values for drpFromYear are set in code. The client-side function looks
> like this...
>
> function ValidateValidFromDate(s, e) {
> fromMonth = parseInt(document.aspnetForm.drpFromMonth.selected Index);
> fromYear =
> parseInt(document.aspnetForm.drpFromYear.options[document.aspnetForm.drpFromYear.selectedIndex].value);
> now = new Date;
> nowMonth = now.getMonth();
> nowYear = now.getYear();
> dateOK = false;
> if (fromYear > nowYear) {
> dateOK = false;
> }
> if (fromYear == nowYear) {
> if (fromMonth <= nowMonth) {
> dateOK = true;
> } else {
> dateOK = false;
> }
> }
> if (fromYear < nowYear) {
> dateOK = true;
> }
> e.IsValid = dateOK;
> }
>
> I originally had document.form1.drpFromMonth in there, which worked. Since
> I had this error, I tried changing it to
> document.aspnetForm.drpFromMonth as that uses the form name that is
> generated by the framework. I tried setting the form's id myself, but it
> was ignored. Whatever I did, the generated page had aspnetForm as the form
> name and ID. I changed my client-side code to use this, but it still
> didn't work.
>
> When I try the page, I get an error...
>
> document.aspnetForm.drpFromMonth.selectedIndex is null or not an object
>
> I have tried various variations, like document.forms[0].drpFromMonth and
> document.all["drpFromMonth"], but with the same result.
>
> Anyone any idea how to get this to work? TIA
>
> --
> Alan Silver
> (anything added below this line is nothing to do with me)



 
Reply With Quote
 
n33470
Guest
Posts: n/a
 
      12-06-2005
Alan,

I can't tell from your sample code, but you will need to
programmatically build your JS function "ValidateValidFromDate". As
you programmatically build that function, instead of "hardwiring" the
reference to the drop down list by doing this:
"document.aspnetForm.drpFromMonth". You should reference ClientId
properties of your controls to get the actual name that will appear in
HTML, substitute those in your function.

For example, you could do something like the following (literalJSScript
is an ASP.NET Literal server control placed on the page somewhere):

literalJScript.Text += "<script language=\"javaScript\" >";
literalJScript.Text += "function ValidateValidFromDate() { ";
literalJScript.Text += " var drpFormDate = document." +
this.Form.ClientId+"[\"" + drpFromDate.ClientID +"\"]; ";

Does this make sense?

 
Reply With Quote
 
Alan Silver
Guest
Posts: n/a
 
      12-06-2005
<snip>
>Does this make sense?


Lots!! It's very similar to the answer I found and posted just a few
minutes ago (which may not have appeared on the server yet). The way I
was doing was to use <%= txtName.ClientID %> in an otherwise normal
<script> block, but the principle is the same. I prefer the way I
showed, simply because the Javascript is easier to read, so easier to
debug. Both would work as well.

Thanks for the reply.

--
Alan Silver
(anything added below this line is nothing to do with me)
 
Reply With Quote
 
Alan Silver
Guest
Posts: n/a
 
      12-06-2005
>me.textbox1.clientid
>
>insert it in js in <%= %> tags


Thanks, I found that just after posting (and posted it for others to
see, but it might not be visible yet).

Thanks very much for the reply.

>"Alan Silver" <alan-> schreef in bericht
>news:cjiEIQK+TIlDFw+...
>> Hello,
>>
>> I have some simple client-side Javascript validation that was working fine
>> until now. For some reason (don't ask me), it has stopped working and I
>> can't figure out why. I have switched to version 2.0 (from 1.1) and have
>> changed the page to use a master page, but other than that, it's the same.
>>
>> I am trying to validate the from date for a credit card to make sure the
>> date has already passed. The code is pretty straightforward. I have two
>> dropdown controls and a custom validator...
>>
>> <aspropDownList ID="drpFromMonth" RunAt="server">
>> <asp:ListItem value="01">01/January</asp:ListItem>
>> ... etc ...
>> <asp:ListItem value="12">12/December</asp:ListItem>
>> </aspropDownList>
>>
>> <aspropDownList ID="drpFromYear" RunAt="server" />
>>
>> <asp:CustomValidator ControlToValidate="drpFromMonth"
>> OnServerValidate="ValidateValidFrom"
>> ClientValidationFunction="ValidateValidFromDate" Display="Dynamic"
>> ErrorMessage="not valid yet" Text="not valid yet" Runat="Server" />
>>
>> The values for drpFromYear are set in code. The client-side function looks
>> like this...
>>
>> function ValidateValidFromDate(s, e) {
>> fromMonth = parseInt(document.aspnetForm.drpFromMonth.selected Index);
>> fromYear =
>>
>>parseInt(document.aspnetForm.drpFromYear.optio ns[document.aspnetForm.dr
>>pFromYear.selectedIndex].value);
>> now = new Date;
>> nowMonth = now.getMonth();
>> nowYear = now.getYear();
>> dateOK = false;
>> if (fromYear > nowYear) {
>> dateOK = false;
>> }
>> if (fromYear == nowYear) {
>> if (fromMonth <= nowMonth) {
>> dateOK = true;
>> } else {
>> dateOK = false;
>> }
>> }
>> if (fromYear < nowYear) {
>> dateOK = true;
>> }
>> e.IsValid = dateOK;
>> }
>>
>> I originally had document.form1.drpFromMonth in there, which worked. Since
>> I had this error, I tried changing it to
>> document.aspnetForm.drpFromMonth as that uses the form name that is
>> generated by the framework. I tried setting the form's id myself, but it
>> was ignored. Whatever I did, the generated page had aspnetForm as the form
>> name and ID. I changed my client-side code to use this, but it still
>> didn't work.
>>
>> When I try the page, I get an error...
>>
>> document.aspnetForm.drpFromMonth.selectedIndex is null or not an object
>>
>> I have tried various variations, like document.forms[0].drpFromMonth and
>> document.all["drpFromMonth"], but with the same result.
>>
>> Anyone any idea how to get this to work? TIA
>>
>> --
>> Alan Silver
>> (anything added below this line is nothing to do with me)

>
>


--
Alan Silver
(anything added below this line is nothing to do with me)
 
Reply With Quote
 
n33470
Guest
Posts: n/a
 
      12-06-2005
Alan,

With respect to the formName....that's not a bug. It comes from the
fact that the form on your ASPX page is not named with the "id"
attribute. If the "id" is not specified ASP.NET assigns a default name
to the form. In previous versions of ASP.NET the default was the name
of the class (which I like better), but in ASP.NET 2.0 the default name
is somewhat non-deterministic. If you use need the form's name, you
can use the ClientId property of that as well.

I'm working through this exact problem right now because we have
automated testing tools which depend on the full JavaScript object name
of the form. I'm adding code to our base page class that will assign a
better ID to the form. If interested, here it is:

if (this.Form != null && this.Form.ID == null)
{
string pageName = this.GetType().BaseType.Name;
this.Form.ID = pageName;
}

--steve

 
Reply With Quote
 
Alan Silver
Guest
Posts: n/a
 
      12-06-2005
Steve,

Thanks for the reply. I was surprised to think that such a bug could
have got this far!! See below...

>With respect to the formName....that's not a bug. It comes from the
>fact that the form on your ASPX page is not named with the "id"
>attribute. If the "id" is not specified ASP.NET assigns a default name
>to the form. In previous versions of ASP.NET the default was the name
>of the class (which I like better),


Hmm, my 1.1 code set the id of the form and that was used, not the class
name. I had the opening part of the form tag in a user control, so it
was common to all pages. I always got an id of "form1", which was what I
set.

> but in ASP.NET 2.0 the default name
>is somewhat non-deterministic. If you use need the form's name, you
>can use the ClientId property of that as well.


I actually found it worked better using document.forms[0] instead of the
form id.

<snip>

Thanks for the reply

--
Alan Silver
(anything added below this line is nothing to do with me)
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Validation Summary not showing for client side validation cwhankey@gmail.com ASP .Net 1 12-12-2008 02:32 AM
How to execute client-side code _after_ client-side validation? Bogdan ASP .Net 2 06-09-2008 01:31 PM
Client side script after client side validation with asp.net 2.0 Boss302 ASP .Net 0 11-21-2006 08:43 AM
Using both server side validation and client side validation =?Utf-8?B?dmlkeWE=?= ASP .Net 1 06-02-2005 09:45 PM
ASP.NET Web Forms Validation Controls are Server-Side or Client-Side Validation? Matt ASP .Net 14 01-30-2004 09:15 AM



Advertisments
 



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57