SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Oct 2008
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    jQuery: Getting values from multiple dropdown box

    Hi,

    I have a multiple dropdown box with a list of boxes.

    HTML Code:
    <label for="rightBarBox[]">Right Bar Box</label>
    <select name="rightBarBox[]" multiple>
         <option value="0" selected="selected">none</option>
         <option value="4">Lose Wheat, Lose Weight</option>
         <option value="3">The Big Book of Wheat Free Cooking</option>
         <option value="2">Learn To Cook Wheat, Gluten and Dairy Free</option>
         <option value="1">The Gluten, Wheat & Dairy Free Cookbook</option>
    </select>
    HTML Code:
    <ol id="sort-boxes">
         <li>List Item 1</li>
         <li>List Item 2</li>
         <li>List Item 3</li>
         <li>List Item 4</li>
    </ol>
    What I intend to do is when the user clicks on the options they choose, each option is duplicated into an ordered list to the right of the dropdown box, with each list item being 'sortable' (using the sortable jQuery UI). At the moment I am trying to get the values from the multiple dropdown box into the unordered list, which is where I am struggling and require some advice. Then ultimately, the user can shuffle the order of the values in the ordered list and save that order to a database.

  2. #2
    Barefoot on the Moon! silver trophy Force Flow's Avatar
    Join Date
    Jul 2003
    Location
    Northeastern USA
    Posts
    4,606
    Mentioned
    56 Post(s)
    Tagged
    1 Thread(s)
    These should help get you started:

    http://api.jquery.com/val/
    http://api.jquery.com/selected-selector/

    You'll want to use the :selected selector.

    Add an id tag to the select element, then you can do something like this:

    Code:
    $('#yourid:selected').each(function(){
    var thevalue = $(this).val();
    var thetext = $(this).text();
    //your code here
    });
    Visit The Blog | Follow On Twitter
    301tool 1.1.5 - URL redirector & shortener (PHP/MySQL)
    Can be hosted on and utilize your own domain

  3. #3
    SitePoint Member
    Join Date
    Oct 2008
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, will look up on those 2 and do some research into how to implement them and let you know how it goes...


Bookmarks

Posting Permissions

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