#javascript #jquery
#javascript #jquery
Вопрос:
У меня есть сценарий, в котором я заполняю таблицу данных n количеством строк. Строки заполняются группами с определенным идентификатором группы. Скажем, если есть 20 строк, и они разделены на 4 группы, первые 5 строк будут иметь идентификатор группы = 1, а следующие 5 строк будут иметь идентификатор группы = 2 и так далее. При создании таблицы каждая строка будет иметь свой идентификатор группы, сохраненный в переменной.
Моя задача — установить флажки для всех строк в группе, но сделать доступной только первую строку определенной группы. Если пользователь устанавливает / снимает первый флажок определенной группы, все флажки этой конкретной группы будут установлены / сняты.
Я добиваюсь этого, объединяя счетчик с элементом id каждой строки, а затем выполняя цикл по всей таблице в каждой строке, сравнивая текущую строку с ее предыдущей строкой в идентификаторе группы. Если идентификатор группы текущей строки совпадает с предыдущей строкой, он получит состояние флажка предыдущей строки и установит текущий флажок в том же состоянии. Ничего не делается, если идентификатор группы текущей строки отличается от предыдущей строки.
Проблема здесь в том, что эта логика работает абсолютно нормально, но только один раз. Проверка / снятие всех флажков работает только после этого, он просто проверяет / снимает этот конкретный флажок, но не для всей группы.
При необходимости предоставит дополнительную информацию. Спасибо
function checkBoxTick(){
for(var i = 0; i<$('#grouprowcount').val(); i ){
if(i != 0){
var previd = $('#groupId' (i-1)).val();
var nextid = $('#groupId' (i)).val();
if(previd == nextid ){
$("#numid" (i)).attr("checked", true);
if($("#numid" (i-1)).is(":checked")){
$("#numid" (i)).attr("checked", true);
}
else if($("#numid" (i-1)).is(":not(:checked)")){
$("#numid" (i)).attr("checked", false);
}
}
}
}
Комментарии:
1. Просто глупый вопрос. Поскольку все флажки одной группы имеют общее состояние, почему бы просто не создать только один флажок для каждой группы?
2. Это совершенно правильный вопрос 🙂 Причина в том, что я использую плагин Datatables для своей таблицы, и количество столбцов должно совпадать с количеством строк. Таким образом, каждая строка в группе должна иметь флажок в этом столбце. Во-вторых, я сохраняю данные в группе, но по строкам. Данные сохраняются для строк, для которых установлен флажок. Поэтому я думаю, что лучше поставить флажок для каждой строки для сохранения данных.
3. Я понимаю. Если вы добавите разметку, подобную двум группам, и то, как вы запускаете функцию, я уверен, что кто-нибудь на это посмотрит. Исходя из этого, вы сокращаете все до одного правильного селектора.
4. Что значит добавить разметку? Я могу добавить gif-изображение проблемы, если это разрешено здесь. Функция вызывается при onclick флажка. Таким образом, он будет запускаться каждый раз, когда с любым флажком взаимодействуют.
5. добавьте также html-код.
Ответ №1:
Пожалуйста, проверьте, действительно ли это то, что вам нужно, в противном случае я предлагаю вам показать нам фрагмент вашего собственного кода.
var groupCount = 2;
for(var i = 1; i <= groupCount; i )
$(':checkbox').filter('[name="group-' i '"]').not(':first').prop('disabled', true);
$(':checkbox').not(':disabled').change(function() {
var group = $(this).attr('name');
var checked = $(this).prop('checked');
$(':checkbox').filter('[name="' group '"]').prop('checked', checked);
}); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<table>
<tr><td><input type="checkbox" name="group-1" /></td></tr>
<tr><td><input type="checkbox" name="group-1" /></td></tr>
<tr><td><input type="checkbox" name="group-1" /></td></tr>
<tr><td><input type="checkbox" name="group-2" /></td></tr>
<tr><td><input type="checkbox" name="group-2" /></td></tr>
<tr><td><input type="checkbox" name="group-2" /></td></tr>
</table>