
11.02.2018, 15:00
|
Профессор
|
|
Регистрация: 14.09.2013
Сообщений: 252
|
|
При выборе чекбокса заносить его значение в массив
Добрый день. Есть такой код html:
<div id="qwestion_40" class="question_item">
<b>Вопрос 2 (3 правильных варианта ответа - последовательность 5,2,3)</b>
<div id="8" data-max="3" data-seq="1">
<input name="qw_40[seq]" value="1" type="hidden">
<input name="qw_40[cta]" value="3" type="hidden">
<div><input id="answer_40_57" value="57" class="chbx" name="qw_40[]" type="checkbox"> <label for="answer_40_57"><span></span>Ответ 1</label></div>
<div><input id="answer_40_58" value="58" class="chbx" name="qw_40[]" type="checkbox"> <label for="answer_40_58"><span></span>Ответ 2 (true)</label></div>
<div><input id="answer_40_59" value="59" class="chbx" name="qw_40[]" type="checkbox"> <label for="answer_40_59"><span></span>Ответ 3 (true)</label></div>
<div><input id="answer_40_60" value="60" class="chbx" name="qw_40[]" type="checkbox"> <label for="answer_40_60"><span></span>Ответ 4</label></div>
<div><input id="answer_40_61" value="61" class="chbx" name="qw_40[]" type="checkbox"> <label for="answer_40_61"><span></span>Ответ 5 (true)</label></div>
</div>
</div>
Скажите, как мне при выборе чекбокса, заносить его значение в массив или например в скрытое поле input. Проблема в том, что мне нужно заносить последовательность выбранных чекбоксов. А значит, если пользователь передумал и какой-то чекбокс отменил, его значение должно удаляться из массива выбранных.
Пытался таким кодом, но он не удаляет убранный пользователем чекбокс из последовательности:
$(':checkbox').on('click', function() {
var chbx = $(this);
var seq = chbx.parent().parent().attr('data-seq');
if (seq == 1) {
if (chbx.is(':checked')){
console.log(chbx.val());
}
}
});
|
|

11.02.2018, 15:52
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,989
|
|
Сообщение от Batyabest
|
Проблема в том, что мне нужно заносить последовательность выбранных чекбоксов.
|
Это не проблема, просто нужно обрабатывать изменение каждого флажка, а в массив заносить всегда новые состояния всех выбранных флажков.
|
|

11.02.2018, 15:52
|
Профессор
|
|
Регистрация: 14.09.2013
Сообщений: 252
|
|
Сейчас накропал такой код, вроде бы решает задачу, но хотел бы совета, может можно как-то улучшить?
var arr = [];
$(":checkbox").on('click', function() {
arr = $(":checkbox:checked").map(function(i,el){
return $(el).val();
}).get();
console.log(arr);
});
|
|

11.02.2018, 15:53
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,989
|
|
Зачем набор выбранных флажков помещать в скрытое поле?
|
|

11.02.2018, 15:54
|
Профессор
|
|
Регистрация: 14.09.2013
Сообщений: 252
|
|
laimas, подскажите, а как мне потом этот массив отправить на сервер - я планировал через скрытый input - тупеж да?))
Скажите, как исправить код с поста №3: он у меня значения всегда по порядку отправляет в массив, а мне нужно именно в том порядке, как клика пользователь
Последний раз редактировалось Batyabest, 11.02.2018 в 15:57.
|
|

11.02.2018, 15:57
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,989
|
|
Сообщение от Batyabest
|
подскажите, а как мне потом этот массив отправить на сервер
|
А на сервере и будет массив только выбранных флажков под ключом qw_40. Не выбранные флажки на сервер не передаются.
Сообщение от Batyabest
|
я планировал через скрытый input - тупеж да?
|
Еще какой. Не нужно дублировать имеющееся всякой ненужной хренью.
|
|

11.02.2018, 15:59
|
Профессор
|
|
Регистрация: 14.09.2013
Сообщений: 252
|
|
Сообщение от laimas
|
А на сервере и будет массив только выбранных флажков под ключом qw_40. Не выбранные флажки на сервер не передаются.
|
Точно! Вот я лох чилийский...
Подскажите мне - у меня мой код отправляет значения по порядку в массив - то есть они всегда выстроены там в порядке возрастания значений. А мне нужно в том порядке, как кликал пользователь.
|
|

11.02.2018, 16:11
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,989
|
|
Сообщение от Batyabest
|
Подскажите мне - у меня мой код отправляет значения по порядку в массив - то есть они всегда выстроены там в порядке возрастания значений. А мне нужно в том порядке, как кликал пользователь.
|
Ну если важен порядок набора, тогда флажки не должны иметь имен, чтобы на сервер их не отправлять, а выбор их через скрытое поле. Правда определять по значения кто есть кто, не самый лучший вариант.
Скорее правильнее будет именовать флажки по индексу в наборе
name="qw_40[1]"
name="qw_40[2]"
....
Скрытого поля не надо, а при выборе флажка помещать его вверх в форме, под последним выбранным. Если выбранный флажок сброшен, то он возвращается на свое место в форме - под полем чей индекс максимален но меньше чем у сброшенного.
В этом случае в массиве на сервере значения ключей, это есть последовательность выбора флажков.
|
|

11.02.2018, 16:15
|
Профессор
|
|
Регистрация: 14.09.2013
Сообщений: 252
|
|
laimas,
Вот такой код собирает правильно последовательность. В итоге имею массив со значениями в выбранном порядке. Но проблема в том, что таких блоков у меня на странице может быть несколько - как мне для каждого формировать свой массив последовательности?
var checklist = [];
$(':checkbox').on('click', function() {
var val = this.value|0; // to int
if (this.checked) {
checklist.push(val); // если в начало, то .ushift(val)
} else {
var idx = $.inArray(val, checklist);
if( idx > -1 ){
checklist.splice(idx, 1);
}
}
console.log(checklist);
});
|
|

11.02.2018, 16:38
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,989
|
|
Batyabest,
а то что этот способ полная профанация, мысль не посещает?
Надо полагать, что последовательность 5,2,3, это не прихоть, а номера вариантов ответов. А значит северу важно знать именно их. По уму, хотя я и не знаю что значат значения флажков, но сервер обязан знать, что 1, это 55, а 2, это 79. И ему от клиента эти значения не нужны, зная ключи этих значений он всегда сможет получить сами значения если надо.
Значит value флажков должны содержать значения ключей, а имена без индексов. Тогда значения массивов и будет порядком выбора.
Скрытым полем или как я предлагал, решайте сами. Но пользователю соблюсти последовательность и не видеть ее при этом (ведь варианты то он может менять) разве удобно? А вот если выбранные располагать согласно последовательности набора, это будет наглядно.
|
|
|
|