Tablesorter плагин
Вложений: 1
Здравствуйте, помогите, пожалуйста.
Сделал в таблице первую колонку всю с чекбоксами так, что бы при отметке первого - в шапке, все остальные отмечались. В общем все работает. После подсоединил плагин TableSorter для возможности сортировки таблицы. Все работает, кроме того, что чекбокс верхний стал отмечать через один чекбоксы и при этом сортировать их странным образом (прикрепляю скриншот). В чем может быть дело ? Вот код отметки всех чекбоксов $('#select_all').change(function() {
var checkboxes = $('input[type="checkbox"]');
for (var i = 0; i < checkboxes.length; i++) {
if(this.checked == true) {
this.checked = false;
checkboxes[i].checked = false;
}
else {
this.checked = true;
checkboxes[i].checked = true;
}
}
return false;
});
Ссылка на плагин http://tablesorter.com/ Помогите, если можете, пожалуйста. Спасибо. |
почему
Цитата:
|
Что бы можно было не только отметить все, но и снять все отметки. 5 и 9 это снять/отметить.
|
change, видимо, чтоб действовало и при нажатии пробела на этом чекбоксе. А вообще много лишних телодвижений, имхо
<input type="checkbox" id="select_all" > select all
<input type="checkbox" >
<input type="checkbox" >
<input type="checkbox" >
<input type="checkbox" >
<input type="checkbox" >
<input type="checkbox" >
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script>
$('#select_all').change(function() {
var isChek = this.checked;
$('input:checkbox').each(function(){this.checked = isChek});
});
</script>
|
Цитата:
|
Так тоже делал, но так будет только отмечать.
|
Я их уже убрал, и теперь все отмечаются, кроме
$('#select_all')
|
Цитата:
|
Synov_son,
:cray: <!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
#myTable{border:5px ridge #73766f;border-collapse:collapse}
#myTable thead,th{background:-webkit-linear-gradient(top right,#b8b9b1,#fff);background:-moz-linear-gradient(top right,#b8b9b1,#fff);background:-o-linear-gradient(top right,#b8b9b1,#fff);background:-ms-linear-gradient(top right,#b8b9b1,#fff);text-align:center;vertical-align:text-top;padding:10px;border-bottom:3px ridge #73766f;border-left:1px solid #73766f;border-collapse:collapse}
#myTable td,tr{text-align:left;vertical-align:text-top;padding:10px;border:1px solid #73766f;border-collapse:collapse;background:#fff}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.30.4/js/jquery.tablesorter.min.js"></script>
<script>
$(document)
.ready(function () {
$("#myTable")
.tablesorter({
headers: {
0: {
sorter: false // запрет сортировки нулевой колонки средствами плагина
}
}
});
$('#select_all')
.click(function (event) {
//event.stopPropagation()
var checkboxes = $('input[type="checkbox"]')
.not(this);
checkboxes.prop('checked', this.checked)
});
});
</script>
</head>
<body>
<table id="myTable" >
<thead>
<tr>
<th><input name="" type="checkbox" id="select_all"></th>
<th>Фамилия</th>
<th>Имя</th>
<th>Email</th>
<th>Платеж</th>
<th>Сайт</th>
</tr>
</thead>
<tbody>
<tr>
<td><input name="" type="checkbox"></td>
<td>Иванов</td>
<td>Петр</td>
<td>ivanov@gmail.com</td>
<td>$50.00</td>
<td>http://www.ivanov.ua</td>
</tr>
<tr>
<td><input name="" type="checkbox"></td>
<td>Петров</td>
<td>Иван</td>
<td>petrov@yandex.ru</td>
<td>$50.00</td>
<td>http://www.petrov.com.ru</td>
</tr>
<tr>
<td><input name="" type="checkbox"></td>
<td>Сергеев</td>
<td>Михаил</td>
<td>sergeed@mail.ru</td>
<td>$100.00</td>
<td>http://www.sergeev.ru</td>
</tr>
<tr>
<td><input name="" type="checkbox"></td>
<td>Михайлов</td>
<td>Потап</td>
<td>medvedev@rambler.ru</td>
<td>$50.00</td>
<td>http://www.yandex.com</td>
</tr>
</tbody>
</table>
</body>
</html>
|
так
.each(function(){this.checked = isChek})
|
| Часовой пояс GMT +3, время: 18:07. |