469,619 Members | 1,963 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,619 developers. It's quick & easy.

Onchange select

133 100+
Hi,

I have 2 lists in a form one for a type of property and the other for price type. What i want to do is have a function so if i select property "Flats" then the price type menu will alter to Per Week.

This is what i have so far but don't know how to go after this?

Expand|Select|Wrap|Line Numbers
  1.  
  2.    function doChange() {
  3.  
  4.       var sel = document.forms[0].property_type.selectedIndex;  
  5.  
  6.       if (document.forms[0].property_type[sel].value = "Flat") {
  7.  
  8.       }
  9.  
  10.    }
  11.  
HTML
Expand|Select|Wrap|Line Numbers
  1. <form>
  2. <select name="price_type" id="price_type" style="width:120px;">
  3.      <option value="P/M">Let (Per Month)</option>
  4.      <option value="P/W">Let (Per Week)</option>
  5.      <option value="N/A">Buy</option>
  6.     </select>
  7.  
  8.     <select name="property_type" id="property_type" style="width:120px;">
  9.       <option value="">Type</option>
  10.         <option value="Detached">Detached</option>
  11.        <option value="Semi Detached">Semi Detached</option>
  12.         <option value="Terraced">Terraced</option>
  13.         <option value="Flat">Flat</option>
  14.         <option value="Apartment">Apartment</option>
  15.         <option value="Bungalow">Bungalow</option>
  16.         <option value="Dormer Bungalow">Dormer Bungalow</option>
  17.         <option value="Maisonette">Maisonette</option>
  18.     </select>
  19. </form>
  20.  
Cheers,
Adam
Aug 20 '09 #1
3 3072
Dormilich
8,652 Expert Mod 8TB
Expand|Select|Wrap|Line Numbers
  1.    function doChange() {
  2.  
  3. // you can use sel as reference to the select element
  4. // would be more clear while reading code
  5.       var sel = document.forms[0].property_type.selectedIndex;  
  6.  
  7. // big mistake here, = is the assignment operator, use ==
  8.       if (document.forms[0].property_type[sel].value = "Flat") {
  9.  
  10.       }
  11.  
  12.    }
some ideas I came up with
Expand|Select|Wrap|Line Numbers
  1.    function doChange() 
  2.     {
  3. // good names are half the code …
  4.       var props = document.forms[0].property_type;  
  5. // do the same with the other select
  6.       var price = document.forms[0].price_type;  
  7.  
  8. // if you write incidentally = here, you’ll get an error
  9. // besides that the code is quite explanatory now
  10.       if ("Flat" == props[props.selectedIndex].value) 
  11.       {
  12.            price.selectedIndex = 1;
  13.       }
  14.    }
Aug 20 '09 #2
adamjblakey
133 100+
Thank you very much for your reply, it works a treat :)
Aug 20 '09 #3
Dormilich
8,652 Expert Mod 8TB
some additional improvements:
Expand|Select|Wrap|Line Numbers
  1. function doChange() 
  2. {
  3.     if ("Flat" == this[this.selectedIndex].value) 
  4.     {
  5.         document.forms[0].price_type.selectedIndex = 1;
  6.     }
  7. }
  8. document.forms[0].property_type.onclick = doChange;
Aug 20 '09 #4

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

8 posts views Thread by Yeah | last post: by
3 posts views Thread by b_naick | last post: by
2 posts views Thread by donald | last post: by
1 post views Thread by Jan Doggen | last post: by
14 posts views Thread by The Natural Philosopher | last post: by
reply views Thread by devrayhaan | last post: by
reply views Thread by gheharukoh7 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.