#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2013
    Posts
    59
    Rep Power
    2

    Select box listing in php


    Hi Friends,

    I have two select box one is years listing and another one is months listing.

    years
    -----
    fresher
    0
    1
    2
    3
    4
    5

    months
    -------
    1
    2
    3
    4
    etc

    My expecting output are listed below.

    1: When the page loads, months select box will hide and years select box will show.
    2: When we click on years 1 to 5, months select box will show. 3: When we click on fresher in years select box, months select box will be hide.

    Please help me.

    Thanks & Regards.
  2. #2
  3. Confused badger
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Mar 2009
    Location
    West Yorkshire
    Posts
    1,047
    Rep Power
    487
    This would be better done with jQuery ...
    wrap both selects in their own SPAN (or DIV) with the SPAN having it's own ID
    e.g.

    Code:
    <span id='years_select'>
     <select id='years' name='years'>
      <option value='x'>X</option>
      <option value='y'>Y</option>
      <option value='z'>Z</option>
     </select>
    </span>
    <span id='months_select' style='display:none;'>
     <select id='months' name='months'>
      <option value='x'>X</option>
      <option value='y'>Y</option>
      <option value='z'>Z</option>
     </select>
    </span>
    Then, your jQuery would be something like
    Code:
    $('#years').change( function() {
      if ($('#years').val() != "X" ){
        $('#months_select').fadeIn(300);
      } else {
        $('#months_select').fadeOut(300);
      }
    });
    You'll notice that although the code above will work, I'm not doing everything for you, you should be able to take that and make it work for yourself!
    Have fun (and please, feel free to post back if you get stuck!)
    "For if leisure and security were enjoyed by all alike, the great mass of human beings who are normally stupefied by poverty would become literate and would learn to think for themselves; and when once they had done this, they would sooner or later realise that the privileged minority had no function and they would sweep it away"
    - George Orwell, 1984
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2013
    Posts
    59
    Rep Power
    2
    Originally Posted by badger_fruit
    This would be better done with jQuery ...
    wrap both selects in their own SPAN (or DIV) with the SPAN having it's own ID
    e.g.

    Code:
    <span id='years_select'>
     <select id='years' name='years'>
      <option value='x'>X</option>
      <option value='y'>Y</option>
      <option value='z'>Z</option>
     </select>
    </span>
    <span id='months_select' style='display:none;'>
     <select id='months' name='months'>
      <option value='x'>X</option>
      <option value='y'>Y</option>
      <option value='z'>Z</option>
     </select>
    </span>
    Then, your jQuery would be something like
    Code:
    $('#years').change( function() {
      if ($('#years').val() != "X" ){
        $('#months_select').fadeIn(300);
      } else {
        $('#months_select').fadeOut(300);
      }
    });
    You'll notice that although the code above will work, I'm not doing everything for you, you should be able to take that and make it work for yourself!
    Have fun (and please, feel free to post back if you get stuck!)
    Thanks you so much. I got it.

IMN logo majestic logo threadwatch logo seochat tools logo