I'm working with the awesome select2 control.

I'm trying to clean and disable the select2 with the content too so I do this:

$(#select2id).empty();

$(#select2id).select2(disable);

Ok, it works, but if i had a value selected all the items are removed, the control is disabled, but the selected value is still displayed. I want to clear all content so the placeholder would be showed. Here is a example I did where you can see the issue: http://jsfiddle.net/BSEXM/

HTML:

<select id=sel data-placeholder=This is my placeholder>

    <option></option>

    <option value=a>hello</option>

    <option value=b>all</option>

    <option value=c>stack</option>

    <option value=c>overflow</option>

</select>

<br>

<button id=pres>Disable and clear</button>

<button id=ena>Enable</button>

Code:

$(document).ready(function () {

    $(#sel).select2();



    $(#pres).click(function () {

        $(#sel).empty();

        $(#sel).select2(disable);

    });



    $(#ena).click(function () {

        $(#sel).select2(enable);

    });

});

CSS:

#sel {

    margin: 20px;

}

Do you have any idea or advice to this?