Прокрутите флажки и подсчитайте каждый из них, отмеченный или снятый


82

Я столкнулся с небольшой проблемой. Вот краткое объяснение.

У меня на стандартной форме 12 флажков. Что мне нужно сделать, так это пройтись по каждому из них и узнать, какие из них отмечены, а какие нет.

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

(Check1 - проверено)
(Check2 - не проверено)
(Check3 - проверено)

1,0,1

Пока что у меня есть этот фрагмент кода.

$('input[type=checkbox]').each(function () {
           if (this.checked) {
               console.log($(this).val()); 
           }
});

Он работает отлично, за исключением того, что возвращает только отмеченные, а не все.

Извините за новый вопрос. Я новичок в jquery.


5
Вам следует изменить схему своей базы данных.
SLaks

Как изменить дизайн? Разве хранение группы флажков в одном поле не лучше, чем наличие одного поля для каждого флажка?
Ричард М.

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

"Разве не лучше хранить группу флажков в одном поле, чем иметь по одному полю для каждого флажка?" Нет, потому что ваши единицы и нули не хранятся как биты, они хранятся как байты. Если ваша причина для хранения битового списка значений, разделенных запятыми, в одном поле, связана с эффективностью, то потеряйте запятую и используйте вместо нее побитовые операции и операции маски . Хотя сегодня в mysql реализован битовый тип данных, поэтому побитовая обработка и маска могут не понадобиться, если только вы не программируете чипы кредитных карт или вам не нужно что-то абсолютно быстрое.
Blue Water

Ответы:


127

Чтобы построить строку результата точно в том формате, который вы показываете, вы можете использовать это:

var sList = "";
$('input[type=checkbox]').each(function () {
    sList += "(" + $(this).val() + "-" + (this.checked ? "checked" : "not checked") + ")";
});
console.log (sList);

Однако я согласен с @SLaks, я думаю, вам следует пересмотреть структуру, в которой вы будете хранить это в своей базе данных.

РЕДАКТИРОВАТЬ : Извините, я неправильно прочитал формат вывода, который вы искали. Вот обновление:

var sList = "";
$('input[type=checkbox]').each(function () {
    var sThisVal = (this.checked ? "1" : "0");
    sList += (sList=="" ? sThisVal : "," + sThisVal);
});
console.log (sList);

1
Насколько я понимаю, он хочет строку на 1s и 0s.
SLaks

Благодарю. Я попробую это и дам вам знать.
Ричард М.

Хм. Я пробовал это, но он отображал весь файл js в журнале консоли.
Ричард М.

1
Я не могу использовать это, но мне нужно использовать $ (this)
V-SHY

1
@ Si8 - Я обновил скрипку, поэтому код игнорирует невыделенные флажки, что должно избавить
Эд Шембор

61

Использование селекторов

Вы можете получить все отмеченные флажки следующим образом:

var boxes = $(":checkbox:checked");

И все не проверено вот так:

var nboxes = $(":checkbox:not(:checked)");

Вы можете просто просмотреть любую из этих коллекций и сохранить эти имена. Если что-то отсутствует, вы знаете, что это было проверено или нет. В PHP, если у вас есть массив имен, которые были проверены, вы можете просто сделать in_array()запрос, чтобы узнать, следует ли проверять какой-либо конкретный флажок позже.

Сериализовать

jQuery также имеет метод сериализации, который будет поддерживать состояние элементов управления вашей формы. Например, пример, представленный на веб-сайте jQuery, следующий:

single=Single2&multiple=Multiple&multiple=Multiple3&check=check2&radio=radio2

Это позволит вам сохранить информацию о том, какие элементы были проверены.


16

Вы можете просмотреть все флажки, написав $(':checkbox').each(...).

Если я правильно понял ваш вопрос, вы ищете следующий код:

var str = "";

$(':checkbox').each(function() {
    str += this.checked ? "1," : "0,";
});

str = str.substr(0, str.length - 1);    //Remove the trailing comma

Этот код будет перебирать все флажки и добавлять либо 1,или 0,к строке.


Благодарю. Я тоже попробую.
Ричард М.

Вы также можете использовать атрибут value. Если вы пытаетесь создать двоичное значение, дайте каждому флажку увеличивающуюся степень 2 и просто сложите отмеченные единицы, сумма в двоичном формате будет такой же, как при добавлении единиц и нулей. Вы будете ограничены 32 флажками (наибольшее числовое значение 2 ^ 32 в JavaScript [я думаю, могло бы быть 64]. Более гибкий дизайн базы данных был бы более гибким)
Джейсон Сперске

0

Я не думаю, что достаточно времени было уделено рассмотрению схемы, поднятому в исходном сообщении. Итак, вот что нужно учесть новичкам.

Допустим, вы создали это решение. Все ваши второстепенные значения объединяются в одно значение и хранятся в базе данных. Вы действительно экономите [немного] места в своей базе данных и немного времени на кодирование.

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

Итак, вы добавляете флажок в пользовательский интерфейс (простая часть). Ваш циклический код уже будет объединять значения независимо от количества флажков. Вы также полагаете, что поле вашей базы данных - это просто varchar или другой строковый тип, так что это тоже должно быть хорошо.

Что происходит, когда клиенты или вы пытаетесь просмотреть данные до изменения? По сути, вы сериализуете слева направо. Однако теперь значения после 3 отличаются на 1 символ. Что вы собираетесь делать со всеми имеющимися у вас данными? Собираетесь ли вы написать приложение, вытащить все это обратно из базы данных, обработать, чтобы добавить значение по умолчанию для новой позиции вопроса, а затем сохранить все это обратно в базу данных? Что произойдет, если у вас будет несколько новых значений с разницей в неделю или месяц? Что, если вы переместите местоположения и jQuery обработает их в другом порядке? Все ваши данные закрыты и должны быть повторно обработаны, чтобы переупорядочить их.

Вся концепция НЕ обеспечивать тесные отношения «ключ-значение» - лудакрис, и рано или поздно у вас возникнут проблемы. Тем из вас, кто задумывается об этом, пожалуйста, не надо. Другие предложения по изменению схемы в порядке. Используйте дочернюю таблицу, дополнительные поля в основной таблице, таблицу вопросов и ответов и т. Д. Просто не храните немаркированные данные, если структура этих данных может измениться.


-1
$.extend($.expr[':'], {
        unchecked: function (obj) {
            return ((obj.type == 'checkbox' || obj.type == 'radio') && !$(obj).is(':checked'));
        }
    });

$("input:checked")
$("input:unchecked")
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.