При выборе чекбокса заносить его значение в массив
 

Добрый день. Есть такой код 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">&nbsp;<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">&nbsp;<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">&nbsp;<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">&nbsp;<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">&nbsp;<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());
             }
       } 
});

Это не проблема, просто нужно обрабатывать изменение каждого флажка, а в массив заносить всегда новые состояния всех выбранных флажков.

Сейчас накропал такой код, вроде бы решает задачу, но хотел бы совета, может можно как-то улучшить?

var arr = [];
                        $(":checkbox").on('click', function() {
                            arr = $(":checkbox:checked").map(function(i,el){
                                return $(el).val();
                            }).get();
                            console.log(arr);
                        });

Зачем набор выбранных флажков помещать в скрытое поле?

laimas, подскажите, а как мне потом этот массив отправить на сервер - я планировал через скрытый input - тупеж да?))

Скажите, как исправить код с поста №3: он у меня значения всегда по порядку отправляет в массив, а мне нужно именно в том порядке, как клика пользователь

А на сервере и будет массив только выбранных флажков под ключом qw_40. Не выбранные флажки на сервер не передаются.

Еще какой. Не нужно дублировать имеющееся всякой ненужной хренью.

Точно! Вот я лох чилийский...
Подскажите мне - у меня мой код отправляет значения по порядку в массив - то есть они всегда выстроены там в порядке возрастания значений. А мне нужно в том порядке, как кликал пользователь.

Ну если важен порядок набора, тогда флажки не должны иметь имен, чтобы на сервер их не отправлять, а выбор их через скрытое поле. Правда определять по значения кто есть кто, не самый лучший вариант.

Скорее правильнее будет именовать флажки по индексу в наборе

name="qw_40[1]"
name="qw_40[2]"
....

Скрытого поля не надо, а при выборе флажка помещать его вверх в форме, под последним выбранным. Если выбранный флажок сброшен, то он возвращается на свое место в форме - под полем чей индекс максимален но меньше чем у сброшенного.

В этом случае в массиве на сервере значения ключей, это есть последовательность выбора флажков.

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);
                            });

Batyabest,
а то что этот способ полная профанация, мысль не посещает? ;)

Надо полагать, что последовательность 5,2,3, это не прихоть, а номера вариантов ответов. А значит северу важно знать именно их. По уму, хотя я и не знаю что значат значения флажков, но сервер обязан знать, что 1, это 55, а 2, это 79. И ему от клиента эти значения не нужны, зная ключи этих значений он всегда сможет получить сами значения если надо.

Значит value флажков должны содержать значения ключей, а имена без индексов. Тогда значения массивов и будет порядком выбора.

Скрытым полем или как я предлагал, решайте сами. Но пользователю соблюсти последовательность и не видеть ее при этом (ведь варианты то он может менять) разве удобно? А вот если выбранные располагать согласно последовательности набора, это будет наглядно.