I need to do that: When I click on a button, an alert comes out to show me all the IDs of the selected boxes. How can I do this?
Visual example:
| BUTTON| - View the selected tests in an alert.
⬜ ALL | PRODUCT | SAMPLE ID
⬜ - - - Test 1 - - SD7168
⬜ - - - Test 2 - - BH1560
⬜ - - - Test 3 - - CP4327
So I want if, for example, I selected test 1, an alert comes to me informing me the ID (SD7168) of the test I selected.
Expand|Select|Wrap|Line Numbers
- // Button
- <h4>
- <a href="" class="btn btn-info" onclick="return confirm('View selected tests')">
- <br><small>TEST ID</small></a>
- </h4>
- // Checkbox select all
- <tr>
- <th><input type="checkbox" name="select-all" id="select-all"/>
- <label for="select-all" class='smallLabel'></label>
- </th>
- </tr>
- // Checkbox select single
- <tr>
- <td>
- <input type="checkbox" name="<?='checkbox-'.$num?>" id="<?='checkbox-'.$num?>"/>
- <label for="<?='checkbox-'.$num?>" class='smallLabel'></label>
- </td>
- // ID parameter
- <td>
- <?=$test->sampleID?> Select: <input id="<?='checkbox-'.$num?>" type="checkbox"/> <br>
- </td>
- // JS Checkboxes
- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
- // Listen for click on toggle checkbox
- $('#select-all').click(function(event) {
- if(this.checked) {
- // Iterate each checkbox
- $(':checkbox').each(function() {
- this.checked = true;
- });
- } else {
- $(':checkbox').each(function() {
- this.checked = false;
- });
- }
- });
- // JS che I created to manage the alert
- $('<?='checkbox-'.$num?>').click(function() {
- alert("Checkbox state (method 1) = " + $('<?='checkbox-'.$num?>').prop('checked'));
- alert("Checkbox state (method 2) = " + $('<?='checkbox-'.$num?>').is(':checked'));
- });
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>