0

I am using nice select dropdown, which has multiple options that i can check or uncheck.

Issue here is that I can either check or uncheck all options and what needed is checking particular checkboxes on load of page.

I tried a lot and also added these lines. 

$('#Person').val("1").prop('checked', true);          
$("#Person").niceSelect("update");

While executing this shows "checked: true" in console,but changes don't reflect on page.

For unchecking all checkboxes I am using below code. 

$(".styled-checkbox").prop('checked', false);

<div class="box"><div class="nice-select wide"  tabindex="0" id="Person"></div></div>    

$('#Person').val("1").prop('checked', true);
$("input[type=checkbox][value=" + xy + "]").attr("checked", "true");
$("#Person").val(xy);
$('#Person').val(xy).prop('selected', true);
$('#Person').val(xy);      
$('#Person').multiSelect('select', [2, 1]);
$("#Person option[value='2']").prop('selected', true);
$("#Person option[value='2']").attr("selected", true);

How to set checked or unchecked checkbox using its value?

James Z
  • 12,209
  • 10
  • 24
  • 44
Gargee
  • 11
  • 1
  • 10

2 Answers2

0

You are using the wrong prop to select the value you of the dropdown, try this

<select id="abc">
  <option value="">Select</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>


//abc id of your select and i want to select option with value 2
<script>
  $('#abc option[value="2"]').prop("selected", "true");
  $("select").niceSelect("update");
</script>
Muhammad Shareyar
  • 772
  • 2
  • 7
  • 21
0

I got solution this by removing word "checked" from below code. It was used to checked all checkboxes by default on load at other place. If we will remove this word then we can check or uncheck particular option.

'<li> <input class="styled-checkbox" checked id="styled-checkbox-' + i + '" type="checkbox" value="' + data[i][dataValueField] + '"><label for="styled-checkbox-' + i + '">' + data[i][dataTextField] + '</label></li>';
Gargee
  • 11
  • 1
  • 10