ListBox Items Remains After Replace By Empty Array In JQuery

I have a list box which I want to clear by jQuery without page refresh.

Solution 1:

You can try something like this to get it reset:

 $("#lbComplaints option:selected").removeAttr("selected");

Solution 2:

Unselect

$("#lbComplaints").find("option").attr("selected", false);

You are using select2.js. Modify your javascript as below

var $listX = $('#lbComplaints').select2({
        placeholder: 'select a state',
        //tags: "true",
        //allowClear: true,
        theme: "classic"
    });

    $('input[type="submit"]').click(function (e) {
            e.preventDefault(); 
           $listX.val(null);
    )};

see the documentation here https://select2.github.io/examples.html#programmatic-control

Solution 3:

But a similar answer was found in

link

As i am using select2 jQuery cannot clear selected items so using select2 $('#lbComplaints').select2('data', null); this works perfectly

Share