Counting commas within a string

M

Mike N.

Hello:

I have a form that contains a multiple-select field that has 12
options in it. I would like the user to be able to select UP TO FOUR
of those options. If they select more than four, I would like to alert
them of the error. To do this, I figure that counting commas would be
the easiest method (i.e., IF commas > 3 THEN alert user).

NOTE: I have an existing "validateForm" function for this form and I'd
like to add this IF-THEN STATEMENT to it.

Any assistance is much appreciated. Also, if there's a better method
than "comma counting" I'm all ears. :)

Thanks,
Mike
 
J

J. J. Cale

Mike N. said:
Hello:

I have a form that contains a multiple-select field that has 12
options in it. I would like the user to be able to select UP TO FOUR
of those options. If they select more than four, I would like to alert
them of the error. To do this, I figure that counting commas would be
the easiest method (i.e., IF commas > 3 THEN alert user).

NOTE: I have an existing "validateForm" function for this form and I'd
like to add this IF-THEN STATEMENT to it.

Any assistance is much appreciated. Also, if there's a better method
than "comma counting" I'm all ears. :)
Click to expand...

keep the ears get rid of the commas
the code below was tested in IE5.0.
<HTML><HEAD><TITLE>Multi Select</TITLE>
<script type=text/javascript>
function validate() {
var counter=0, a=document.forms[0].elements["oSelect"];
for (var i=0;i<a.length;i++)
if(a.options.selected==true)
if(++counter>=3) alert("STOP");
}
</script>
</HEAD>
<BODY>
<FORM>
<SELECT ID="oSelect" NAME="Cars" MULTIPLE onchange="validate()">
<OPTION VALUE="1" SELECTED>BMW
<OPTION VALUE="2">Porsche
<OPTION VALUE="3">Mercedes
<OPTION VALUE="4">Ferrari
<OPTION VALUE="5">Peugot
Thanks,
Mike
Click to expand...
Hope this helps
Jimbo
 
D

Dr John Stockton

JRS: In article <[email protected]>, dated
Wed, 15 Sep 2004 11:50:26, seen in Mike N.
I have a form that contains a multiple-select field that has 12
options in it. I would like the user to be able to select UP TO FOUR
of those options. If they select more than four, I would like to alert
them of the error. To do this, I figure that counting commas would be
the easiest method (i.e., IF commas > 3 THEN alert user).
Click to expand...


The simple method, which combines brevity with not creating many
intermediate objects, is

var CommaCount = myString.replace(/[^,]/g, "").length
if ( CommaCount > 3 ) { OUCH! }

See <URL:http://www.merlyn.demon.co.uk/js-valid.htm#CCh> ; and the rest
of the page.
 
M

Mike N.

Thanks Jimbo! That works very well.

Would there be any way that the function could also keep a +4 option
from being select after the user is alerted? For example, if the user
selects more options after an alertbox displays, even though they will
be alerted again the +4 options remain selected after all of the
alertboxes are extinguished.

I know that web users can be an adventurous lot sometimes. I really need
to ensure that there are no more than four options selected before they
can submit the form.

Thanks All!
 
L

Lee

Mike N. said:
I know that web users can be an adventurous lot sometimes. I really need
to ensure that there are no more than four options selected before they
can submit the form.
Click to expand...

It's (nearly?) impossible to ensure that.

You absolutely must also check the data on the server side, as well.
Some will have javascript enabled. Some will construct their own
forms that submit to your server. Some will override your validation
function.

I've done all three to get around validations that annoyed me.

By the way, don't give up on using the much simpler "split"
method. Whoever has to maintain this page in the future will
appreciate it.
 
M

Mike N.

Thanks Lee!

When using the split(), wouldn't that also require looping through the
array of values created by the multiple-select field?
 
M

Mike N.

Well, I have the split() working, but only with a hardcoded value (e.g.,
"Option1, Option2, Option3, Option4"). When I attempt to insert the
value from the form field by replacing the above with...

var value = document.form.myOptions.value

...it doesn't work. Shouldn't the form field value be in the same
comma-separated format?

Please forgive my ignorance here. I am an HTML/ASP web developer and
rarely use JS.

Thanks
 
R

RobG

*Mike N.* wrote in comp.lang.javascript:
Well, I have the split() working, but only with a hardcoded value (e.g.,
"Option1, Option2, Option3, Option4"). When I attempt to insert the
value from the form field by replacing the above with...

var value = document.form.myOptions.value
Click to expand...
[snip]

I dont' get this!! What the OP really wants is a way of
seeing how many options have been selected - counting commas
is just the broken way he'd decided to do it.

Mike, just read the selected options into an array (which
has to be done anyway to do further processing) then find
the length of the array. Try this:

<script type="text/javascript">
/* Gets VALUES of selected options */
function getSelectedValues(a) {
var r = new Array();
for (var i = 0; i < a.options.length; ++i) {
if (a.options.selected) {
r[r.length] = a.options.value;
}
}
return r;
}
/* Does the validation */
function validate(theItem) {
var x = getSelectedValues(theItem);
if (x.length >= 3) {
alert(x + ' is too many');
theItem.form.reset();
} else {
alert('You selected ' + x.length);
}
}
</script>
<form name="fred" action="">
<select id="oselect" name="cars" multiple
onchange="validate(this)">
<option value="1" selected>BMW
<option value="2">Porsche
<option value="3">Mercedes
<option value="4">Ferrari
<option value="5">Peugot
</select><br>
<input type="reset">
</form>

Couple of tips:
1.
Pass a reference to the form or form element your script,

onchange="validate(this)"

that way you don't have to guess where the original form
came from. Using:

a=document.forms[0].elements["oSelect"];

will break as soon as you put another form above the current
form[0] - it will become form[1]. Passing a reference also
means you can do extra stuff, like reset() the form if the
user has done something silly (like try to by a Bimmer,
Merc, Ferrari and a Peugot).

2.
Note that I have selected values, not the text. You can get
the text by changing:

r[r.length] = a.options.value;
to
r[r.length] = a.options.text;

3.
Lastly, don't pester the user with alerts, I've used them
for the sake of this script.


Cheers, Rob.
 
M

Mike N.

Rob,

Thanks so much! It's working well!

I appreciate all of the help from everyone!

Mike
 

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

Measuring a string of text 1
handling commas 3
How to split a string containing nested commas-separated substrings 5
document.write within a form 2
strip commas from string 23
counting the repeated values of a certain row in array 0
Understanding Arrays within Arrays 5
Commas in for loop 5

Members online

Total: 32 (members: 1, guests: 31)
Robots: 82

Forum statistics

Threads
473,780
Messages
2,569,611
Members
45,281
Latest member
Pedroaciny

Latest Threads

Top