Search code examples
javascriptjqueryjquery-select2jquery-tokeninput

Select2 delete tag with backspace


I couldn't find any documentation on deleting tags with the delete or backspace key like you can with jquery tokeninput: http://loopj.com/jquery-tokeninput/

Can you do that with select2?


Solution

  • For a complete answer, you will need to provide the javascript where you are binding the select2 plugin.

    However, Select2 does allow you to delete options with the backspace (like the demo you provided) as long as you use tags to fill the dropdown or if you set the option multiple to true, like this:

    Tags<br />
    <input type="text" name="tags" id="tags" style="width: 400px;" />
    <br /><br />
    Multiple<br />
    <input type="text" name="multiple" id="multiple" style="width: 400px;" />
    
    <script>
        $(function(){
            $('#tags').select2({
                tags:["red", "green", "blue"]
            });
    
            $('#multiple').select2({
                data:[
                    {id: "red", text: "red"},
                    {id: "green", text: "green"},
                    {id: "blue", text: "blue"},
                    {id: "black", text: "black"}
                ],
                multiple: true
            });
        });
    </script>
    

    Here is a jsfiddle demo.