Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Aug 2004
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    dynamic drop down in javascript

    I saw there were many sample codes to display dynamic drop down but there were none sample that pre-selected values when the drop down list was displayed.

    Once the drop down is displayed, users can select multiple values from the drop down and the selected values are saved to the database. The next time the drop down is displayed, I want to pre-select values that users already selected and saved before.

    The problem is it only pre-select the last value. For example,
    obj.options[2].selected = true;
    obj.options[3].selected = true;
    and it display the drop down with only the 3rd value pre-selected as opposed to both 2nd and 3rd values.

    However, if I put any alert() statement in there, it worked fine. That is weird.
    obj.options[2].selected = true;
    alert(obj.multiple); <== result is true
    alert(obj.type); <== result is select-one
    obj.options[3].selected = true;

    Does it have to do with the drop down being out of focus or the type is select-one? How do I set the type to select-multiple? I tried obj.type="select-multiple" and it didn't like that.

    Please help. Thank you.

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,074
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Did you set it to multiple programmatically? If you did, you need to set a little delay after setting it for the selected items to take effect.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #3
    New to the CF scene
    Join Date
    May 2006
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi,
    I am having the exact problem
    Here is the code I have,

    ...
    var newSelect = document.createElement("select");
    newSelect.name = "topics[]";
    newSelect.multiple = true;
    newSelect.setAttribute("size","10");
    newSelect.className = "inputbox";
    <?php
    $numRows = count( $rows );
    for( $j = 0; $j < $numRows; $j++ ) {
    $currRow = $rows[$j];
    $html .= "newSelect.options[$j] = new Option('$currRow[topic_name]','$currRow[id]');\r\n";
    $html .= ($currRow['selected'] ? " newSelect.options[$j].selected = true;" : '');
    }
    echo $html;
    ?>
    newTd.appendChild(newSelect);
    ...

    I tried placing a delay after setting the select to multiple, and after preselecting the options. Neither works.

    Any suggestions/ideas?

    Thanks for any help

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,074
    Thanks
    0
    Thanked 256 Times in 252 Posts
    When you create the Option, you can specify if it's selected or not.
    PHP Code:
    for( $j 0$j $numRows$j++ ) {
      
    $currRow $rows[$j]; 
      
    $selected = ($currRow['selected'] ? "true" "false");
      
    $html .= "newSelect.options[$j] = new Option('$currRow[topic_name]','$currRow[id]', $selected, $selected);\r\n"

    See this for more info.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •