Error on submission of form

lucy · September 29, 2009

I have a form with a text box and a combo box on. I have a javascript file which checks that the combo box has been changed from the default value (which is a blank space with a value of -1) and also it checks that the text field is not empty.

If either of these two requirements are not met, it should highlight the box and then let the user update the field by either selecting a value, or entering some text.

It works, but not when i use include the code for the combo box and i dont have a clue why.

Below is my javascript file:



//Check is string is empty, less or greater than allowed
function checkLength(text, min, max){
min = min || 1;
max = max || 10000;

if (text.length < min || text.length > max) {
  return false;
}
return true;
}

//Enable submit button
function validate_check(chk){
   if (chk.checked){
      document.main_form.submit_button.disabled = false;
   }
   else{
      document.main_form.submit_button.disabled = true;
   }
}

//Main vlidation form
function validateForm(){

var errors = [];
var owner_name = document.main_form.owner_name.value;

if (document.main_form.number_of_owners.value = -1) {
        errors[errors.length] = "New error";
	document.main_form.number_of_owners.style.border='1px solid red';
    }
		else if (document.main_form.number_of_owners.value!=-1) {
		document.main_form.number_of_owners.style.border='';
	}

if (!checkLength(owner_name)) {
        errors[errors.length] = "New error";
	document.main_form.owner_name.style.border='1px solid red';
    }
		else if (checkLength(owner_name)) {
		document.main_form.owner_name.style.border='';
	}

   //Report errors
   if (errors.length > 0) {
         return false;
    }

}

The html code is:

<body>
<form action="" method="get">
    <select name="number_of_owners">
        <option value="-1"></option>
        <option>one</option>
    </select>
    <input name="owner_name" type="text" />
</form>
</body>

Please can you help me as to why the javascript works when i omit the combo requirement.

Thanks,

Lucy

KevinM1 · September 29, 2009

The following line:

if (document.main_form.number_of_owners.value = -1) {

Should be:

if (document.main_form.number_of_owners.value == -1){

Note the double equal signs which designate a test for equality.

Also, you're better of caching your values. In other words, instead of writing out long bits like document.main_form.number_of_values... Stick them in a variable. So, for your validateForm function, something like:

function validateForm(){
   var errors = [];
   var ownerName = document.main_form.owner_name.value;
   var numOwners = document.main_form.number_of_owners;

   if (numOwners.value == -1){
      errors[errors.length] = "New Error";
      numOwners.style.border = "1px solid red';
   }
   else{
      numOwners.style.border = "";
   }

   if (!checkLength(ownerName)){
      errors[errors.length] = "New Error";
      ownerName.style.border = "1px solid red";
   }
   else{
      ownerName.style.border = "";
   }

   if (errors.length > 0){
      return false;
   }
}

You not only save typing, but your script is actually more efficient this way. Why? Because you're not asking it to find the same element over and over again. You already have a hold of it, so why would you want to force your script to make document.whatever calls to obtain the same data?

lucy · September 30, 2009

I have put them in variables but they wernt working, so i took them out of the variables and they still wenrt working.

Thats a really obvious error with my code about the double = sign instead of the single = for comparission. :-[

Thanks for your help

Sign In

Error on submission of form

Recommended Posts

lucy

Link to comment

Share on other sites

KevinM1

Link to comment

Share on other sites

lucy

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information