jquery multiselect: Cannot remove items from list

Posted on 2011-10-10
Last Modified: 2012-05-12

Not sure what I'm doing wrong here. But from a normal dropdown I can remove items from the list by doing

document.getElementById("dropdownlist1").options.length = 0

However, this doesn't seem to work with the multiselect I'm using ( and I can't for the life of me see what I'm doing wrong. i've tried the code shown below just from stuff off the internet but none of it seemed to have any effect. no errors, but no items removed either

what's going on there?
document.getElementById("multiselect1").options.length = 0
        while (document.getElementById("multiselect1").hasChildNodes()) {
        $('#multiselect1').empty().append('<option selected="selected" value="whatever">text</option>');

Open in new window

Question by:AidenA
    LVL 12

    Expert Comment

    Without seeing your markup, it is difficult to pinpoint the problem.

    I will say, however, that a lot of jQueryUI form widgets actually hide the base object (select element) and instead display other types of elements (such as an unordered list).  

    I think that the multi-select that you are using does this.  I would have to see more of your code or, better yet, a live link to be sure.
    LVL 83

    Accepted Solution

    Looking at the source of one of the demos, the code is using


    So try



    Author Comment

    Hi CodeCruiser, looking at that code I think it would be more likely to be


    but in fact neither way works. I copied the source below which had a couple elements added in. It's inside a ul but that's by me not by the jquery code. It's inside divs etc and ajax update panel but otherwise nothing much else.

    So, apart from that it just looks like a normal select then?
    <li><select name="multiselect1" id="multiselect1" multiple="multiple">
    		<option selected="selected" value="XXXX1">XXXX1</option>
    		<option selected="selected" value="XXXX2">XXXX2</option>

    Open in new window


    Author Comment

    just another thought, i have a style sheet which accesses the multiselect element like so:

    .ui-multiselect-checkboxes li {clear:both; font-size:0.9em; padding-right:0px}

    is there some way to use that through ajax and possibly add another style which removes the writing? although not sure if that's getting messy...

    Author Comment

    (not through ajax, through jquery of course or javascript)

    Author Comment

    The following code solves the issue

    document.getElementById("multiselect1").options.length = 0

    refresh is required to see any changes for some reason. I will give codecruiser some points for getting closest.

    thanks for help, Aiden

    Author Comment

    acutally i see you had said it there and i missed it...

    obviously my fault but could have been good if you'd specified that the link contained a refresh method i should have tried. i think i looked at the link but just saw it was an example and didn't look closely enough


    Featured Post

    6 Surprising Benefits of Threat Intelligence

    All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

    Join & Write a Comment

    Suggested Solutions

    In Part 1 ( we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
    International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
    The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
    The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

    731 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    18 Experts available now in Live!

    Get 1:1 Help Now