473,557 Members | 2,831 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

*Please Help*

Hi there!
Newbie here... :-)
I'm trying to validate a form but can't seem to get it to work... Here's a
copy of the code:
The user has to select a color for every select box. How is this done???
Many thanks
Ann
Ottawa Canada
*************** *
<HTML>
<HEAD>
<Title>My color test</Title>
<script>

function displayColors(f orm)
{
var colorArray = new Array(3);
var box1Index, box2Index, box3Index;
var myString='';

box1Index=docum ent.form1.color 1.selectedIndex ;
box2Index=docum ent.form1.color 2.selectedIndex ;
box3Index=docum ent.form1.color 3.selectedIndex ;

colorArray[0]=document.form1 .color1[box1Index].value;
colorArray[1]=document.form1 .color2[box2Index].value;
colorArray[2]=document.form1 .color3[box3Index].value
for (i=0; i<3; i++)
{
switch(i)
{
case 0:
myString="first ";
break;

case 1:
myString="secon d";
break;

case 2:
myString="third ";
break;

default:
myString=""
}
switch (colorArray[i])
{
case "1":
document.write( '<FONT COLOR="blue">') ;
document.write( "you selected blue as your " + myString +" color<br>")
document.write( '</FONT>')
break;

case "2":
document.write( '<FONT COLOR="red">');
document.write( "you selected red as your " + myString +" color<br>")
document.write( '</FONT>')
break;

case "3":
document.write( '<FONT COLOR="black">' );
document.write( "you selected black as your " + myString +" first
color<br>")
document.write( '</FONT>')
break;

default:
document.write( "no color<BR>");
}//end switch
}//end for
}//end function

function validateOnSubmi t(form)
{
/*??????*/
}

</script>
</HEAD>
<BODY>
<form name=form1 onsubmit="valid ateOnSubmit(thi s.form)">
Pick color 1:
<SELECT id=color1 name=color1 style="WIDTH: 180px">
<OPTION value = "0">Select a color
<OPTION value = "1" name="blue">Blu e
<option value = "2" name="red">Red
<option value = "3" name="black">Bl ack
</OPTION></SELECT>
<br><br>
Pick color 2:
<SELECT id=color2 style="WIDTH: 180px" name=color2>
<OPTION value = "0"> Select a color
<OPTION value = "1" name="blue">Blu e
<option value = "2" name="red">Red
<option value = "3" name="black">Bl ack
</OPTION></SELECT>
<br><br>
Pick color 3:
<SELECT id=color3 style="width: 180px" name=color3>
<OPTION value = "0"> Select a color
<OPTION value = "1" name="blue">Blu e
<option value = "2" name="red">Red
<option value = "3" name="black">Bl ack
</OPTION></SELECT>
<br>
<input TYPE=BUTTON NAME="cmdCalc" VALUE="GO"
onClick=display Colors(this.for m)>
</BODY>
</HTML>

Jul 23 '05 #1
6 1378
"Ann Duguay" <an************ *@yahoo.ca> wrote in message news:<Zy******* *******@news04. bloor.is.net.ca ble.rogers.com> ...
Hi there!
Newbie here... :-)
I'm trying to validate a form but can't seem to get it to work... Here's a
copy of the code:
The user has to select a color for every select box. How is this done???
Many thanks
Ann
Ottawa Canada
*************** *


Is this your first attempt to learn programming? Is this a student
project?

I ask this because most progammers would just let the data in the DOM
and because selecting a color per select box seems contrived.

Document.write can only be used to insert html into the file when the
document is loading. In your case the file has been loaded, you need
to try somehting like innerHTML. To keep it simple, you may just want
to put up an alert box.

Robert
Jul 23 '05 #2
Hi Robert!
Nope.. not a school project :-) I'm getting a little too old for school.
I'm trying to help out a friend that's doing something in HTML but doesn't
have any javascript knowledge. After looking at some code, I thought it
would be easy but I'm having a difficult time.

Her project is a little more complex as it has 55 questions with select
boxes for each and every questions needs to be answered. Upon completion, a
score is calculated based on the answers the user gives and a color report
is printed to the screen (color also is score dependent).

Hence, my small piece of code. I figured I'd start small but I'm stuck with
the validation. All I want to do is to alert the user when the user hasn't
selected anything (or the value is 0).

Thx for taking the time to look at my code.
Ann
"Robert" <rc*******@my-deja.com> wrote in message
news:c6******** *************** ***@posting.goo gle.com...
"Ann Duguay" <an************ *@yahoo.ca> wrote in message

news:<Zy******* *******@news04. bloor.is.net.ca ble.rogers.com> ...
Hi there!
Newbie here... :-)
I'm trying to validate a form but can't seem to get it to work... Here's a copy of the code:
The user has to select a color for every select box. How is this done??? Many thanks
Ann
Ottawa Canada
*************** *


Is this your first attempt to learn programming? Is this a student
project?

I ask this because most progammers would just let the data in the DOM
and because selecting a color per select box seems contrived.

Document.write can only be used to insert html into the file when the
document is loading. In your case the file has been loaded, you need
to try somehting like innerHTML. To keep it simple, you may just want
to put up an alert box.

Robert

Jul 23 '05 #3
In article <__************ **********@news 01.bloor.is.net .cable.rogers.c om>,
an************* @yahoo.ca enlightened us with...
Hi Robert!
Nope.. not a school project :-) I'm getting a little too old for school.
I'm trying to help out a friend that's doing something in HTML but doesn't
have any javascript knowledge. After looking at some code, I thought it
would be easy but I'm having a difficult time.

Her project is a little more complex as it has 55 questions with select
boxes for each and every questions needs to be answered. Upon completion, a
score is calculated based on the answers the user gives and a color report
is printed to the screen (color also is score dependent).

Hence, my small piece of code. I figured I'd start small but I'm stuck with
the validation. All I want to do is to alert the user when the user hasn't
selected anything (or the value is 0).

I'll give you some hints.
box1Index=docum ent.form1.color 1.selectedIndex ; That is not as cross-browser as
box1Index=docum ent.forms["form1"].elements["color1"].selectedIndex;

Now, your function has the form passed in, so you can do
function displayColors(f rm)
Note that I changed "form" to "frm" because I have this thing about having a
variable with the same name as an already defined object ("form" is already
an object in JS).

So, you passed in "frm", so
box1Index=frm.e lements["color1"].selectedIndex;
....
colorArray[0]=frm.elements["color1"].options[box1Index].value;

.... document.write( '<FONT COLOR="black">' ); Don't do that.
document.write can cause odd problems with an already open document.
Instead, use a div and innerHTML or DOM methods createElement and
appendChild.

....
<form name=form1 onsubmit="valid ateOnSubmit(thi s.form)"> should be
<form name="form1" onsubmit="retur n validateOnSubmi t(this.form)">
The function validateOnSubmi t should return true to submit and false to
cancel.

Your object attributes should all be quoted. You have invalid HTML that IE
will accept, but other browsers will puke on. Options must have end tags.
<option>somethi ng</option>
You have some that do and some that don't.
Go validate your page with the W3C. This looks like something made in
Frontpage. IOW, invalid HTML. ;)

.... onClick=display Colors(this.for m)

should be
onClick="displa yColors(this.fo rm)"

As to the validation you asked about, all your selects have an option as the
first one (selectedIndex= 0) that basically tells the user to select a color.
Just have your validator check that for each select the selectedIndex is not
0.

<SELECT id="color2" style="WIDTH: 180px" name="color2">
<OPTION value = "0"> Select a color </option>

the function has something like

function validateOnSubmi t(frm)
{
if (frm.elements["color2"].selectedIndex == 0)
{
alert("You must select an option for color2.");
return false;
}
// put more checks here

// get here, all passed
return true;
}
HTH
--
--
~kaeli~
Well, aren't we just a flipping ray of sunshine?
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #4
Thanks Kaeli! Your input was very helpful :) The only thing that I'm
not clear on is:

....
document.write( '<FONT COLOR="black">' ); Don't do that.
document.write can cause odd problems with an already open document.
Instead, use a div and innerHTML or DOM methods createElement and
appendChild.

As mentioned, I'm new at this. If you can, I would love an example of
this.
Anyway, thanks again for your help. I'm learning lots.
Ann
Ottawa ON Canada
kaeli <ti******@NOSPA M.comcast.net> wrote in message news:<MP******* *************** **@nntp.lucent. com>... In article <__************ **********@news 01.bloor.is.net .cable.rogers.c om>,
an************* @yahoo.ca enlightened us with...
Hi Robert!
Nope.. not a school project :-) I'm getting a little too old for school.
I'm trying to help out a friend that's doing something in HTML but doesn't
have any javascript knowledge. After looking at some code, I thought it
would be easy but I'm having a difficult time.

Her project is a little more complex as it has 55 questions with select
boxes for each and every questions needs to be answered. Upon completion, a
score is calculated based on the answers the user gives and a color report
is printed to the screen (color also is score dependent).

Hence, my small piece of code. I figured I'd start small but I'm stuck with
the validation. All I want to do is to alert the user when the user hasn't
selected anything (or the value is 0).


I'll give you some hints.
box1Index=docum ent.form1.color 1.selectedIndex ;

That is not as cross-browser as
box1Index=docum ent.forms["form1"].elements["color1"].selectedIndex;

Now, your function has the form passed in, so you can do
function displayColors(f rm)
Note that I changed "form" to "frm" because I have this thing about having a
variable with the same name as an already defined object ("form" is already
an object in JS).

So, you passed in "frm", so
box1Index=frm.e lements["color1"].selectedIndex;
...
colorArray[0]=frm.elements["color1"].options[box1Index].value;

...
document.write( '<FONT COLOR="black">' );

Don't do that.
document.write can cause odd problems with an already open document.
Instead, use a div and innerHTML or DOM methods createElement and
appendChild.

...
<form name=form1 onsubmit="valid ateOnSubmit(thi s.form)">

should be
<form name="form1" onsubmit="retur n validateOnSubmi t(this.form)">
The function validateOnSubmi t should return true to submit and false to
cancel.

Your object attributes should all be quoted. You have invalid HTML that IE
will accept, but other browsers will puke on. Options must have end tags.
<option>somethi ng</option>
You have some that do and some that don't.
Go validate your page with the W3C. This looks like something made in
Frontpage. IOW, invalid HTML. ;)

...
onClick=display Colors(this.for m)

should be
onClick="displa yColors(this.fo rm)"

As to the validation you asked about, all your selects have an option as the
first one (selectedIndex= 0) that basically tells the user to select a color.
Just have your validator check that for each select the selectedIndex is not
0.

<SELECT id="color2" style="WIDTH: 180px" name="color2">
<OPTION value = "0"> Select a color </option>

the function has something like

function validateOnSubmi t(frm)
{
if (frm.elements["color2"].selectedIndex == 0)
{
alert("You must select an option for color2.");
return false;
}
// put more checks here

// get here, all passed
return true;
}
HTH
--

Jul 23 '05 #5
"Ann Duguay" <an************ *@yahoo.ca> wrote in message news:<__******* *************** @news01.bloor.i s.net.cable.rog ers.com>...
Hi Robert!
Nope.. not a school project :-) I'm getting a little too old for school.
I'm trying to help out a friend that's doing something in HTML but doesn't
have any javascript knowledge. After looking at some code, I thought it
would be easy but I'm having a difficult time.
Programming with Javascript in a web browser requires learning a lot.
Just because Javascript doesn't have pointers doesn't make programming
easy.

I suggest programming in Netscape 7.1 or firefox. Once you have
things working test in IE. The best book on javascript is
"JavaScript : The definitive guide" by David Flanagan.

Once you get tired of the alert boxes, see my post:
http://groups.google.com/groups?hl=e....earthlink.net

It wrapped. See the second post on Re: Debug - Your own console.
Her project is a little more complex as it has 55 questions with select
boxes for each and every questions needs to be answered. Upon completion, a
score is calculated based on the answers the user gives and a color report
is printed to the screen (color also is score dependent).


This may get you started. I tested this in Netscape 7.1 and IE 5.2 on
MacOS 10.2.6. Be sure to have popup windows enabled!

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<Title>My color test</Title>
<script type="text/javascript">

function displayColors(f orm)
{
alert("in dislayColors. Display results in a popup window.");
var aDate = new Date();
var colorList = ["none","blue"," red","black"];
var windowName = "myWindowColor" ;
newWindow = window.open("", windowName,
"scrollbars=yes ,resizable=yes, width=700,heigh t=500");

newWindow.docum ent.writeln(
'<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN">');
newWindow.docum ent.writeln(
"<html>");
newWindow.docum ent.writeln(
"<header><title >Window " + windowName + "</title></header>");
newWindow.docum ent.writeln(
"<body><p>T he information that follows was generated on "
+ aDate + "</p>");
for (var i=1; i<=3; i++)
{
var boxColor=form.e lements["color" + i].value;

newWindow.docum ent.writeln(
"<p><span style='color:" + colorList[boxColor] + "';>" +
"You picked color "+ colorList[boxColor] +
" for input number " + i + "." +
"</span></p>");
}

return true;
} //end function

function processColors(f orm)
{
alert("in processColors." );
// form contains a reference to the current form
var boxColor;

for (var i=1; i<=3; i++)
{
boxColor=form.e lements["color" + i].value;
alert("boxColor = " + boxColor);
if (boxColor == 0 )
{
alert("You need to pick a color for " + i + ".");
return false;
}
}
displayColors(f orm);
return true;
} //end function

function validateOnSubmi t(form)
{
alert("in validateOnSubmi t.");
}

</script>
</HEAD>
<BODY>
<!-- I believe that you need to have a HTML submit button
for the form to be submitted and your onsubmit event
handler to get control. -->
<form name="form1"
onsubmit="valid ateOnSubmit(thi s.form)">
Pick color 1:
<SELECT name="color1" name=color1 style="WIDTH: 180px">
<OPTION value = "0">Select a color
<OPTION value = "1" name="blue">Blu e
<option value = "2" name="red">Red
<option value = "3" name="black">Bl ack
</OPTION></SELECT>
<br><br>
Pick color 2:
<!-- I avoid having duplicate id & name names.
There is a lot of confusion of when to use
id and name. I am confused too. name seems
to be the one used
for forms. id seems to be the newer one.
Don't know what happens when use both with the same
name. -->
<SELECT name="color2" style="WIDTH: 180px">
<OPTION value = "0"> Select a color
<OPTION value = "1" name="blue">Blu e
<option value = "2" name="red">Red
<option value = "3" name="black">Bl ack
</OPTION></SELECT>
<br><br>
Pick color 3:
<SELECT name="color3" style="width: 180px">
<OPTION value = "0"> Select a color
<OPTION value = "1" name="blue">Blu e
<option value = "2" name="red" >Red
<option value = "3" name="black">Bl ack
</OPTION></SELECT>
<br>
<input TYPE=BUTTON NAME="cmdCalc" VALUE="GO"
onClick="proces sColors(this.fo rm)">

</BODY>
</HTML>
Robert
Jul 23 '05 #6
In article <ae************ **************@ posting.google. com>,
an*******@yahoo .ca enlightened us with...
Thanks Kaeli! Your input was very helpful :) The only thing that I'm
not clear on is:

...
document.write( '<FONT COLOR="black">' );

Don't do that.
document.write can cause odd problems with an already open document.
Instead, use a div and innerHTML or DOM methods createElement and
appendChild.

As mentioned, I'm new at this. If you can, I would love an example of
this.
Anyway, thanks again for your help. I'm learning lots.


Search the archives for people who did it and it caused their problem. *grin*

Long link:
http://groups.google.com/groups?hl=en&lr=&ie=UTF-8
&q=javascript+d ocument.write+w iped+out&btnG=S earch

tiny:
http://tinyurl.com/6d3uk

'document.write ' is a bad way to do pretty much anything. It can work in some
situations (writing dynamic content to brand new windows, such as popups, it
works just fine) and is the only way to get dynamic content in Netscape 4,
but since it's dicey and NN4 is old, it's pretty much outlived its
usefulness.
The thing is, you can often use it to write to a layer without killing
things, but a lot of times it ends up not doing what you wanted it to do.
It's kind of like "eval" - most of the time it's used, it causes more
problems than it solves.

If you are at all familiar with C, it's kind of like using a pointer (char *)
when a character array (char[50]) will do. Both can work, but one can really
get you into trouble if you don't use it right. *g*

HTH
--
--
~kaeli~
Once you've seen one shopping center, you've seen a mall.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #7

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

0
1687
by: Kurt Watson | last post by:
I’m having a different kind of problem with Hotmail when I sign in it says, "Web Browser Software Limitations Your Current Software Will Limit Your Ability to Use Hotmail You are using a web browser that Hotmail does not support. If you continue to use your current browser software we cannot guarantee that Hotmail will work correctly for...
7
3582
by: x muzuo | last post by:
Hi guys, I have got a prob of javascript form validation which just doesnt work with my ASP code. Can any one help me out please. Here is the code: {////<<head> <title>IIBO Submit Page</title> </head> <style type="text/css">
7
3263
by: tyler_durden | last post by:
thanks a lot for all your help..I'm really appreciated... with all the help I've been getting in forums I've been able to continue my program and it's almost done, but I'm having a big problem that I believe if it's solved, the remaining stuff is easy... my full program until now is here: http://www.geocities.com/tom4_h4wk/progmail.zip the...
23
3245
by: Jason | last post by:
Hi, I was wondering if any could point me to an example or give me ideas on how to dynamically create a form based on a database table? So, I would have a table designed to tell my application to create certain textboxes, labels, and combo boxes? Any ideas would be appreciated. Thanks
13
4310
by: Joner | last post by:
Hello, I'm having trouble with a little programme of mine where I connect to an access database. It seems to connect fine, and disconnect fine, but then after it won't reconnect, I get the error "operation is not allowed when object is open" so I take out the line of code: BookDetails.Connection1.Open and it comes up with the error...
1
9603
by: David Van D | last post by:
Hi there, A few weeks until I begin my journey towards a degree in Computer Science at Canterbury University in New Zealand, Anyway the course tutors are going to be teaching us JAVA wth bluej and I was wondering if anyone here would be able to give me some tips for young players such as myself, for learning the language. Is this the...
1
54483
PEB
by: PEB | last post by:
POSTING GUIDELINES Please follow these guidelines when posting questions Post your question in a relevant forum Do NOT PM questions to individual experts - This is not fair on them and we instruct our experts to ignore any such PMs completely Be sure to give the version of Access that you are working with and the Platform and OS if...
0
3037
by: 2Barter.net | last post by:
newsmail@reuters.uk.ed10.net Fwd: Money for New Orleans, AL & GA Inbox Reply Reply to all Forward Print Add 2Barter.net to Contacts list Delete this message Report phishing Show original
6
3296
by: jenipriya | last post by:
Hi all... its very urgent.. please........i m a beginner in oracle.... Anyone please help me wit dese codes i hv tried... and correct the errors... The table structures i hav Employee (EmpID, EmpName,DeptID,DateOfJoin, Sal, Addr) Finance (EmpID, Sal) Club (Clubname, EmpID, Fee, DateOfJoin) Leave (EmpID, Date) Department (DeptID, DeptName,...
5
2296
by: tabani | last post by:
I wrote the program and its not giving me correct answer can any one help me with that please and specify my mistake please it will be highly appreciable... The error arrives from option 'a' it asks for user name, check in the system but does not return the correct answer please help me with it. or if you have better way of doing it would you...
0
7626
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main...
0
8061
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that...
1
7591
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For...
0
7911
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the...
0
6180
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then...
1
5454
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes...
0
5172
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert...
0
3599
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in...
0
867
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.