Reset jQuery multiselect dropdown with a checkbox

Question

Below is my code,

<link href="jquery.multiselect.css" rel="stylesheet">

<button type="button" class="resetbuttonclass" id="resetsfilter" name="reesetfilter">Reset</button>

<select id="ticket_status_all" name="ticket_status_all[]" class="custom_dropdown" multiple="multiple" >
    <!--<option value=""  >Select Current Status</option>-->
    <option value="10"  class='custom_dropdown_option'>Awaiting Details</option>
    <option value="6"  class='custom_dropdown_option'>In Progress</option>
    <option value="8"  class='custom_dropdown_option'>On Hold</option>
    <option value="1"  class='custom_dropdown_option'>Open</option>
    <option value="2"  class='custom_dropdown_option'>Resolved</option>
    <option value="12"  class='custom_dropdown_option'>TR for PRD</option>
    <option value="11"  class='custom_dropdown_option'>Under UAT</option>
    <option value="9"  class='custom_dropdown_option'>Unit Test</option>
</select>   

<script src="jquery.multiselect.js" ></script> 

Initialize multi-select

$('#ticket_status_all').multiselect({
    placeholder: 'Select Current Status',
    maxPlaceholderOpts: 2,
});

Reset button click event listener:

$("#resetsfilter").click(function () {
    $("#ticket_status_all option:selected").prop("selected", false);
    $("#ticket_status_all").multiselect('refresh');
});

The above code doesn't "deselect" the checkbox. In multi-select mod, it shows selected values instead of placeholder.

please help me to resolve it

Answer 1

One way is use javascript if jquery is not properly working to deslect the value.

function clearSelected(){
    var elements = document.getElementById("ticket_status_all").options;

    for(var i = 0; i < elements.length; i++){
      elements[i].selected = false;
    }
  }

Then call ticket_status_all Solution 2: You can go through APi with examples http://loudev.com/