validate a group of inputs on a form

[DKY]

I stumbled accross something along these lines for form validation online somewhere. problem is I dont know how to make it say the same popup for a certain "group" of selection boxes and stuff. Say I have in a group of textboxes a textbox called textbox_1 and then a textbox_2 and then 3 and 4. How would I have it pop up if none are selected and say something like 'you need to select something in this group'?

<script type="text/javascript">
<!--

function formValidation(form){
if(notEmptytextbox1(form.textbox_1)){
return true;
}
return false;
}
function notEmptytextbox1(elem){
var str = elem.value;
if(str.length == 0){
alert("You must fill in the textbox 1 field");
return false;
} else {
return true;
}
}

//-->
</script>

[lilleman]

Hi,

I took the liberty to rewrite it from scratch (I hope you don't mind).

function validateFields(oForm, iFields)
{
  var fields = oForm.elements;
  
  for( var f = 1; f <= iFields; f++ )
  {
    if( fields['textbox_'+ f] && fields['textbox_'+ f].value.length == 0 )
    { alert('You must fill in the textbox '+ f +' field!'); return false; }
  }
  
  return true;
}

The function is used as shown below:

<form ... onsubmit="return validateFields(this, x)">

... where x is the number of textboxes.

[DKY]

I dont mind, it helps me to learn. Can you explain to me how what you posted works? What does it do exactly? I'm new and need my hand held :-)

[DKY]

The reason I ask how it works is because in actuallity, by textboxes are not named textbox_1 and textbox_2. they dont have numbers that increment, so doing an addition incrementation wouldnt work (which is what i think is going on in this script). my textboxes are actually named 'no_part_number' 'invalid_intl_part_number' 'supplier_part_number_only' 'no_packing_list' etc.... I just thought it would be easier if I made up fake input box names as an example.

[lilleman]

Hi,

Yes, the function I posted assumes that they're named textbox_1, textbox_2, etc. However, the way you have it is actually easier (at least I think it is) since you can then loop through all elements (unless you have other fields in the form too; then you would have to specify the names of the fields that should be validated) and check their length. Well, here's a suggestion:

function validateFields(oForm)
{
  var elements = oForm.elements;
  
  for( var e = 0; e < elements.length; e++ )
  {
    if( elements[e].value.length == 0 )
    {
      alert('You must fill in the field ' + elements[e].name);
        return false;
    }
  }
  
  return true;
}

... and it's used like this:

<form ... onsubmit="return validateFields(this)">

If it doesn't work for you, let me know.