mercredi 29 avril 2020

Get checkboxs value with Jquery return wrong values sometimes but not everytime

I try to get the checkbox checked values, It "works" not really well, sometimes I have the right value, sometime not, could you explain me why and how I can fix this ?

The purpose is at this end to build an array of all the values checked

Here a snippet :

$( "input" ).on( "click", function() {
                alert('test : ' + $( "input:checked" ).val() + " is checked!"  );
});
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="options-check">
    <div class="row">
      <div class="col-sm-4  col-lg-4">

        <div class="form-check form-check-inline">
          <input class="form-check-input" type="checkbox" id="inlineCheckbox1" name="abc" value="all">
          <label class="form-check-label" for="inlineCheckbox1">All</label>
        </div>
        <div class="form-check form-check-inline">
          <input type="checkbox" id="inlineCheckbox2" name="abc"  value="businessrules">
          <label class="form-check-label" for="inlineCheckbox2">Business Rules</label>
        </div>
        <div class="form-check form-check-inline">
          <input  type="checkbox" id="inlineCheckbox3" name="abc" value="scriptinclude">
          <label class="form-check-label" for="inlineCheckbox3">Script Include</label>
        </div>
        <div class="form-check form-check-inline">
          <input  type="checkbox" id="inlineCheckbox4" name="abc" value="schedulejobs">
          <label class="form-check-label" for="inlineCheckbox4">Scheduled Jobs</label>
        </div>
      </div>
      <div class="col-sm-4 col-lg-4">
        <div class="form-check form-check-inline">
          <input  type="checkbox" id="inlineCheckbox5" name="abc" value="uiaction">
          <label class="form-check-label" for="inlineCheckbox5">UI Action</label>
        </div>
        <div class="form-check form-check-inline">
          <input  type="checkbox" id="inlineCheckbox6" name="abc" value="uipolicies">
          <label class="form-check-label" for="inlineCheckbox6">UI Policies</label>
        </div>
        <div class="form-check form-check-inline">
          <input  type="checkbox" id="inlineCheckbox7" name="abc" value="uimacro">
          <label class="form-check-label" for="inlineCheckbox7">UI Macro</label>
        </div>
        <div class="form-check form-check-inline">
          <input type="checkbox" id="inlineCheckbox8" name="abc" value="uipage">
          <label class="form-check-label" for="inlineCheckbox8">UI Page</label>
        </div>
      </div>
      </div>
      </div>

Thanks a lot for your help




Aucun commentaire:

Enregistrer un commentaire