Multiple select box, pop up question

**acoder** · Sep 3 '08, 02:40 PM

Create a validation function to call in the form onsubmit event:
[code=html]<form ... onsubmit="retur n validate()">[/code]In the validate() function, perform your validation. First get the checkbox element. Use the checked property to check if it has been checked. Access the Assignees box element and loop through the options to see if any are selected. If not, you can use alert() to display a message. Alternatively, you can just display an error message next to the element using DOM methods. If it passes validation, return true to submit and false otherwise to prevent submission.

**bonneylake** · Sep 3 '08, 03:03 PM

Hey Acoder,

well i was wondering could i just put it with another validation page i have now?
the original form is to long so i shorted it to show what i was working with. but anyway on my original form page i have this line

Code:

<input type="submit" class="officalsubmit" value="submit" name="submit" onClick="return validate_form();">

an was wondering if that was ok to leave it like that for validation?

an well this is what appears on my validation page.

Code:

function validate_form()
{
//VALIDATES HARDWARE
var hardware = document.getElementById('hardwarefailure')
var tag = document.getElementsByTagName('select')

for(var i=0; i<=tag.length-1; i++){
//check each tag (tag[i]) to see if its hardware failure
 //if it is, then see if its value is nothing
 //Rachels Note (had to use name== instead of id because id is unique and the select each item does not need to be unique)
if(tag[i].name=="hardwarefailure" && tag[i].value =='')
{
	alert ('Please Select Type of Hardware Failure');
	return false;
}
}
//VALIDATES DEPT/VENDOR RESPONSIBILTYS
var dept = document.getElementById('deptvendor')
var tag2 = document.getElementsByTagName('select')

for(var i=0; i<=tag2.length-1; i++){
//check each tag (tag[i]) to see if its hardware failure
 //if it is, then see if its value is nothing
if(tag2[i].name=="deptvendor" && tag2[i].value =='')
{
	alert ('Please Select Dept/Vendor Responsibility');
	return false;
}
}
//VALIDATES PARTS RETURNED
var parts = document.getElementById('partsreturn')
var tag3 = document.getElementsByTagName('select')

for(var i=0; i<=tag3.length-1; i++){
//check each tag (tag[i]) to see if its hardware failure
 //if it is, then see if its value is nothing
if(tag3[i].name=="partsreturn" && tag3[i].value =='')
{
	alert ('Please Select Have all parts been returned');
	return false;
}
}

if(softhardware.value == ''){
softhardware.value = 'NOW IT IS THIS' ;
return false;
}






return true;
}

but i am not sure how to check to see if the checkbox is checked. i have done a select an a input. but how would i do a checkbox?

Thank you again for all the help :),
Rach

**acoder** · Sep 3 '08, 03:23 PM

You can add it to the current validate function.

To validate checkboxes, you'd normally loop over them, but if you only have one, you can just check it directly, e.g.
[code=javascript]var chkbox = document.getEle mentById("chkbo xID");
if (chkbox.checked ) {
//checkbox is checked...
} else {
// checkbox is not checked...[/code]

**bonneylake** · Sep 3 '08, 03:52 PM

Hey Acoder,

Well i was on the right track that means. Figured out if the check box is not checked an had it displaying an alert, got that far. but anyway i changed mine to yours an this is what i have.

Code:

var chkbox = document.getElementById("assignees");
if (chkbox.checked) {
	
}else {
	 alert ( "Checkbox 'assignees' must be selected in order to send email to assignees" );
        return false;
}

but how do i add the part about the tobox?

Thank you :),
Rach

**acoder** · Sep 3 '08, 04:15 PM

If you've not got anything inside the if, it could be shortened to:
[code=javascript]if (!chkbox.checke d) {
alert ( "Checkbox 'assignees' must be selected in order to send email to assignees" );[/code]
For the multiple select box, access it by ID (or name), then use a for loop to loop over its options using the options array. This time you're checking the selected property.

**bonneylake** · Sep 3 '08, 05:46 PM

Hey Acoder,

well i tried this, but its not working correctly. Did i do it wrong? heres the whole thing

Code:

var chkbox = document.getElementById("assignees");
if (chkbox.checked) {

}else {
	 alert ( "Checkbox 'assignees' must be selected in order to send email to assignees" );
        return false;
}


var selected = document.getElementById('toBox')
var tag4 = document.getElementsByTagName('select')

for(var i=0; i<=tag4.length-1; i++){
//check each tag (tag[i]) to see if its hardware failure
 //if it is, then see if its value is nothing
if(tag4[i].name=="toBox" && tag4[i].value =='')
{
	alert ('Please Select Dept/Vendor Responsibility');
	return false;
}
}

Thank you :),
Rach

**acoder** · Sep 3 '08, 06:02 PM

Line 10 is the correct way to access it - get it directly rather than looping over all the select elements.

Then loop over selected.option s. Check for options[i].selected.

**bonneylake** · Sep 3 '08, 06:11 PM

Hey Acoder,

i am still doing something wrong,just not sure what. here is what i got

Code:

var selected = document.getElementById('toBox')

for(var i=0; i<=selected.options[i]; i++){
//check each tag (tag[i]) to see if its hardware failure
 //if it is, then see if its value is nothing
if(selected.options[i].name=="toBox" && selected.options[i].value =='')
{
	alert ('Please Select a assignee');
	return false;
}
}

Thank you,
Rach

**acoder** · Sep 3 '08, 06:20 PM

You need to use another variable (boolean) and set it to false initially and true when you find an option selected. You also have problems in the for loop:

Code:

var selected = document.getElementById('toBox')
var isSelected = false;
for(var i = 0; i < selected.options.length; i++){
    if (selected.options[i].selected) {
...

**bonneylake** · Sep 3 '08, 06:31 PM

Hey Acoder,

Still missing something because when click submit now i get no errors an just takes me to the next page with or without the check box clicked an with or without anything in the multiple select box.

Code:

var chkbox = document.getElementById("assignees");
if (chkbox.checked) {

}else {
	 alert ( "Checkbox 'assignees' must be selected in order to send email to assignees" );
        return false;
}

var selected = document.getElementById('toBox')
var isSelected = false;
for(var i=0; i<=selected.options.length; i++){
if(selected.options[i].selected)
{
	
}else{
	alert ("Please Select a assignee");
	return false;
}


return true;
}

Thank you,
Rach

**acoder** · Sep 3 '08, 07:55 PM

The alert has to be outside the loop. That's the whole point of the isSelected variable. If any option is selected, you set it to true in the loop. Outside the loop, check that isSelected is not true and display an alert:
[code=javascript]if (!isSelected) {
alert(...[/code]

**bonneylake** · Sep 3 '08, 08:07 PM

Hey Acoder,

I thought i understood what you said but i think i might of gotten confused. Here is what i tried

Code:

var chkbox = document.getElementById("assignees");
if (chkbox.checked) {
}else {
	 alert ( "Checkbox 'assignees' must be selected in order to send email to assignees" );
        return false;
}

var selected = document.getElementById('toBox')
var isSelected = false;
for(var i=0; i<=selected.options.length; i++){
if(selected.options[i].selected){	
}	
}
if (!isSelected){
	alert ("Please Select a assignee");
	return false;}
	


return true;
}

Thank you,
Rach

**acoder** · Sep 4 '08, 10:07 AM

You have to set isSelected to true in the if statement and the for loop should loop from 0 to length-1:

Code:

for(var i=0; i<=selected.options.length-1; i++){
    if(selected.options[i].selected){
        isSelected = true;
        break;
    }	
}

**bonneylake** · Sep 4 '08, 01:35 PM

Hey Acoder,

here is what i got. on the if (!isSelected) do i need to change the if to an else? because the checkbox is working right now but the other part is not working.

Code:

var chkbox = document.getElementById("assignees");
if (chkbox.checked) {
}else {
	 alert ( "Checkbox 'assignees' must be selected in order to send email to assignees" );
        return false;
}

var selected = document.getElementById("toBox")
var isSelected = false;
for(var i=0; i<=selected.options.length-1; i++){
if(selected.options[i].selected ){	
isSelected = true;
break;
}	
}
if (!isSelected){
	alert ("Please Select a assignee");
	return false;}
	


return true;
}

Thank you,
Rach

Multiple select box, pop up question

Multiple select box, pop up question

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment