Advanced Search

Return to Snippet

Revision: 19371
at October 22, 2009 10:20 by stancox
Initial Code 
<!-- HTML -->
<select id="my-list">
    <option value="1">Smashing Magazine</option>
    <option value="2">Woork Up</option>
    <option value="3">Mashable</option>
</select>
<input type="button" id="submit-list" value="Button"/>
<ul id="selected-items-list"></ul>

//JavaScript
$("#submit-list").click(function selectItem(){
    s = $("option:selected")
    el = s.text();
    destination = $("#selected-items-list");
    $(destination).append('<li>'+el+'</li>');
    $(destination +':last').css('display', 'none').fadeIn(1000);
    $("option:selected").remove();
    if($('#my-list option').length==0){
        $('input[id=submit-list]').attr('disabled', 'disabled');
    }
});
Initial URL 
http://woorkup.com/2009/10/14/jquery-lessons-how-to-interact-with-html-forms/
Initial Description 

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
Add elements into a list from a select field

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    
list

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
jQuery