I wrote HTML table in which i have checkbox for every row. So now i want to add checkbox in my header which will check all check boxes in the table. I have done it, but it does not work. Any idea?
<table class="table table-hover table-inbox">
<thead>
<tr>
<th>
<input type="checkbox" class="i-checks" id="allmsgs">
</th>
<th>Sender</th>
<th>Message</th>
<th>Last Message</th>
</tr>
</thead>
<tbody>
<tr class="">
<td class="">
<input type="checkbox" name="1" class="i-checks msg">
</td>
<td><a href="#">Jeremy Massey</a></td>
<td><a href="#">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</a></td>
<td class="mail-date"><a href="#">12/12/2019 15:35</a></td>
</tr>
<tr class="unread active">
<td class="">
<input type="checkbox" name="2" class="i-checks msg">
</td>
<td><a href="#">Marshall Horne</a></td>
<td><a href="#">Praesent nec nisl sed neque ornare maximus at ac enim.</a></td>
<td class="mail-date">12/12/2019 15:35</td>
</tr>
<tr>
<td class="">
<input type="checkbox" name="3" class="i-checks msg">
</td>
<td><a href="#">Grant Franco</a></td>
<td><a href="#">Etiam maximus tellus a turpis tempor mollis.</a></td>
<td class="mail-date">12/12/2019 15:35</td>
</tr>
</tbody>
</table>
I have also javascript function ...
$(document).ready(function() {
$('#allmsgs').click(function(event) {
if(this.checked) {
$('.msg').each(function() {
this.checked = true;
});
} else {
$('.msg').each(function() {
this.checked = false;
});
}
});
});
which is located in my scripts.js
file and this one is linked with html (link is not the problem because other functions are working.