javascript - validate 2 dropdowns (only some combinations valid) -


i new javascript.
have size , color dropdowns on page users order product, combinations available i.e. pink color in large sizes.
thought i'd make array of allowed sizes , test user input against these. if choice invalid want popup tell user why.

in real world i'll use sql & php create array of allowed choices, in example below i've hard coded 3 valid choices testing. unfortunately code below doesn't anything.
i'm sure it's simple newb mistake. don't know i'm doing :)
can me out?

the validation function supposed happen when user clicks form submit...

<form id="form1" name="form1" method="post" onsubmit="return validate_form()"       action="cart.php"> 

here's function:

<script type="text/javascript">  function validate_form() {     var allowed = new array();         allowed[0]="10,beige";               allowed[1]="10,black";         allowed[2]="10,pink";      var chosencolind = document.getelementbyid("colid");     var chosencoltext = colid.options[colid.selectedindex].text;     var chosensizeind = document.getelementbyid("sizeid");     var chosensizetext = sizeid.options[sizeid.selectedindex].text;     var chosensizecol = chosensizetext+","+chosencoltext;      var found = "false";      ( var = 0; < allowed.length; i++ ) {         if (allowed[i]=chosensizecol) {             found = "true";         }     }     if (found = "false") {         alert( 'the variation have selected unavailable. please select another.' );         return false;     } else {         return true;     } } </script> 

there few lines use assignment operator (that single equals =) instead of 1 of equality operators (that double or triple equals, triple preferred in javascript). example:

if (found = "false") { 

would appear problem @ first sight - it's assignment not comparison :) use triple equals === instead of single:

if(found === "false") { 

also, consider following (commented) updates code, reflects more typical style of javascript code:

function validate_form() {      //no need use new array(), use array literal instead     var allowed = [         "10,beige",               "10,black",         "10,pink"     ];      var chosencolind = document.getelementbyid("colid");     var chosencoltext = colid.options[colid.selectedindex].text;     var chosensizeind = document.getelementbyid("sizeid");     var chosensizetext = sizeid.options[sizeid.selectedindex].text;     var chosensizecol = chosencoltext+","+chosensizetext;      var found = "false";       ( var = 0; < allowed.length; i++ ) {          //use equality operator instead of assignment         if (allowed[i]===chosensizecol) {             found = true; //may use boolean rather string             break; //exit loop early, no need continue if we've found          }     }     if (!found) { //no need comparison boolean values         alert( 'the variation have selected unavailable. please select another.' );     }     //may return found here we're using boolean     return found; } 

Comments

Popular posts from this blog

jquery - Invalid Assignment Left-Hand Side -

java - Play! framework 2.0: How to display multiple image? -

gmail - Is there any documentation for read-only access to the Google Contacts API? -