POST не отмеченные флажки HTML

У меня есть множество флажков, которые отмечены по умолчанию. Мои пользователи, вероятно, снимут несколько флажков (если таковые имеются) и оставят остальные отмеченными.

Есть ли способ сделать форму POST флажками, которые не отмечены, а не те, которые установлены?


person reach4thelasers    schedule 27.11.2009    source источник


Ответы (40)


Добавьте скрытый ввод для флажка с другим идентификатором:

<input id='testName' type='checkbox' value='Yes' name='testName'>
<input id='testNameHidden' type='hidden' value='No' name='testName'>

Перед отправкой формы отключите скрытый ввод на основе отмеченного условия:

if(document.getElementById("testName").checked) {
    document.getElementById('testNameHidden').disabled = true;
}
person vishnu    schedule 05.07.2013
comment
Если вы собираетесь использовать такое решение на основе разметки, вероятно, лучше сначала поставить скрытый ввод, как и многие другие ответы. Если вы используете PHP, вы можете избавиться от зависимости javascript, потому что используется только последнее значение. - person Ben; 13.09.2013
comment
Проблема в том, что нажатие на метку больше не ставит / снимает флажок, потому что два входа имеют одинаковое имя ... - person gamov; 22.01.2014
comment
gamov, вы ошибаетесь, метки прикрепляются к входам на основе атрибута id, а не атрибута имени входа - person Justin Emery; 31.01.2014
comment
Меня этот ответ немного смутил. OP спросил, как получить все флажки, которые были сняты, а не те, которые отмечены. Я думаю, что они пытаются отправить только скрытые поля для флажков, которые не отмечены, но разве проверенные не скрытые поля также не отправлены на POST? В предоставленном javascript не следует также отключать или снимать отметку с установленного видимого флажка, «testName», чтобы предотвратить его включение в форму POST. Или сервер ищет только поля со скрытыми именами в форме POST, чтобы определить, что не отмечено флажком? - person Phil DD; 11.04.2014
comment
@PhilDD Старый комментарий, но просто для пояснения для людей, которые заходят сюда, снятые флажки не включены в отправленные значения формы. Это решение (и ответ на вопрос OP) позволяет отправлять скрытое вместо снятого флажка. Если этот флажок установлен, он отключит скрытое, чтобы гарантировать, что массив значений (бот CB и скрытый) не будет отправлен. Это избавляет людей от необходимости выполнять внутреннюю проверку флажка, чтобы увидеть, существует ли он (например, с isset () в php), и они могут просто обрабатывать значение, хотя они, вероятно, должны это делать в любом случае. - person Gary Schreiner; 05.01.2015
comment
@GarySchreiner Да, через некоторое время это само прояснилось :-). Скрытые поля заменяют видимые, но не отмеченные флажки. Когда-либо отправляется только одно поле с именем - либо скрытый непроверенный суррогат, либо видимый отмеченный флажок, но каждое из них имеет свой уникальный идентификатор. - person Phil DD; 15.01.2015
comment
Трудно поверить, что авторы так спроектировали его. Почему бы не отправить все поля ввода с некоторым значением по умолчанию для тех, кто не отмечен :( Это было бы гораздо более ясным решением, чем реализация некоторого взлома скрытых полей. Должно быть ясно, что это будет необходимо, и они должны были это увидеть заранее. - person Srneczek; 06.02.2015
comment
Как вы на самом деле это делаете, когда у вас есть имя вроде: name[]? Каждый раз, когда я устанавливаю флажок, он принимает оба значения. Как это исправить? - person Loko; 26.02.2015
comment
@Loko Я добавил класс к скрытому вводу в моей динамической форме, а затем отключил его, найдя ближайший. ‹Тип ввода = скрытое имя = задача [] значение = 0 класс = скрытая_задача /› $ (input [name = 'task []']). Click (function () {var parent = $ (this) .closest ('. section ') if ($ (this) .prop (' checked ') == true && $ (this) .val () == Clip) {$ (. task_hidden, parent) .prop (disabled, true);}) ; - person Progrower; 28.01.2016
comment
Неужели я единственный, кто считает, что основной дизайн элемента checkbox ужасен? Это двоичный элемент управления, они должны отправлять двоичные значения. - person alexw; 21.04.2016
comment
Отлично, сэр. у меня есть другое решение, имеет смысл? ‹Input type = 'checkbox' name = 'testName' class = 'chk_check'› ‹input type = 'text' value = 'No' name = 'testName' id = checkbox_value› ‹! - после тестирования вы меняете type = hidden - ›$ (document) .on ('click', '.chk_check', function () {var is_checked = $ (this) .is (: checked)? 1: 0; $ ('# checkbox_value'). Val (проверено); }); - person Amol Navsupe; 21.04.2017
comment
Одна из проблем с добавлением скрытого ввода с тем же именем, что и у флажка, заключается в том, что код типа frm.testName.checked = true больше не работает, потому что frm.testName теперь представляет собой набор из двух элементов. - person Rudiger W.; 23.09.2018
comment
Другая проблема заключается в том, что скрытый ввод только отключается, а не включается повторно. Это может быть проблемой, если форма использует AJAX для отправки данных, и пользователь может снова использовать форму без загрузки страницы. - person Rudiger W.; 23.09.2018
comment
Самое простое решение - ‹input type = checkbox onclick = $ (this) .val (this.checked? 1: 0) ..› - person Ian; 07.02.2020
comment
Это слишком запутанно, чтобы принимать его в качестве ответа на этот вопрос! Почему бы просто не обработать это на стороне сервера? - person Talha Imam; 19.02.2021

Решение, которое мне понравилось больше всего, - это поместить скрытый ввод с тем же именем, что и флажок, который может не быть отмечен. Я думаю, что это работает так, что если флажок не установлен, скрытый ввод по-прежнему успешен и отправляется на сервер, но если флажок установлен, он переопределит скрытый ввод перед ним. Таким образом, вам не нужно отслеживать, какие значения в опубликованных данных должны были появиться из флажков.

<form>
  <input type='hidden' value='0' name='selfdestruct'>
  <input type='checkbox' value='1' name='selfdestruct'>
</form>
person Sam    schedule 02.01.2010
comment
Теперь, когда я перечитал вопрос, кажется, это было не совсем то, что вы хотели. Однако я задался этим вопросом, когда пытался найти ответ, так что, возможно, он может быть полезен кому-то другому. - person Sam; 02.01.2010
comment
.NET отличается, вместо этого см. stackoverflow.com / questions / 7600817 / - person KCD; 19.11.2012
comment
Следует отметить, что если вы установите этот флажок, браузер отправит скрытые значения и значения флажка. Это решение затем полагается на обработку сервером переменной post с этими двумя значениями. Если он принимает только последнее значение (например, PHP), ваш код будет работать должным образом. Однако некоторые серверы обрабатывают это по-разному. Некоторые выбирают первое значение, а другие помещают оба значения в список / массив. - person Michael Ekoka; 07.02.2013
comment
Я использую этот подход в Ruby on Rails. Если пользователь снимает флажок, отправляется false (0). Если этот флажок установлен, последний ввод с таким же именем перекрывает скрытое поле в соответствии со спецификацией HTML. Если на исходное значение нужно ссылаться в среде без состояния, просто добавьте скрытое поле с другим именем и заполните его значение, например. <input type='hidden' value='1' name='selfdestruct_original'> Он будет передан вместе с отправкой формы. Тогда просто протестируйте на стороне сервера params[:selfdestruct] == params[:selfdestruct_original] - person scarver2; 10.04.2013
comment
Этот ответ основан на предположении, что вы можете ретранслировать только один из двух одинаковых именованных входов, которые будут отправлены на сервер - я не понимаю, почему он получил так много голосов? - person Muleskinner; 24.04.2014
comment
И в чем проблема с этим предположением? Так работают поля HTML-формы. - person Sam; 25.04.2014
comment
@sam не знаю, откуда у тебя эта идея? Когда два или более элемента управления названы одинаково, тогда оба будут отправлены на сервер при отправке (однако для флажков, только если они отмечены) - то, как они обрабатываются на сервере, зависит от реализации на стороне сервера. Если вы мне не верите, вы можете убедиться в этом сами, отслеживая трафик с помощью такого инструмента, как fiddler. - person Muleskinner; 25.04.2014
comment
это решение Rails - person brauliobo; 26.09.2015
comment
ОБА ЗНАЧЕНИЯ ОТПРАВЛЯЮТСЯ, когда установлен флажок. Нет никакого переопределения. Серверы по-разному обрабатывают полученные повторяющиеся значения. В .NET я вижу список, разделенный запятыми, например выкл., Выкл., Вкл., Вкл. - person Triynko; 05.01.2016
comment
Это работает для меня, просто добавьте скрытый ввод перед всем флажком с тем же именем, value = или value = somthing, ничего не добавит в базу данных, если, по крайней мере, один флажок установлен, они попадают в базу данных, но по-прежнему ничего из скрытый ввод - person Jiang Lan; 30.04.2017
comment
Спасибо. Я знаю об этом, но никогда не думал, чтобы это было так устроено. Я почти использую JS - person Coisox; 12.06.2020
comment
Следует также отметить, что ЗНАЧЕНИЕ НЕ ПОСЫЛАЕТСЯ, ЕСЛИ ЕГО НЕ ПРОВЕРЕНО, но я знаю, что люди обычно ищут эту информацию не здесь. - person Netside; 09.09.2020

Я решил это с помощью ванильного JavaScript:

<input type="hidden" name="checkboxName" value="0"><input type="checkbox" onclick="this.previousSibling.value=1-this.previousSibling.value">

Будьте осторожны, чтобы между этими двумя элементами ввода не было пробелов или разрывов строк!

Вы можете использовать this.previousSibling.previousSibling для получения «верхних» элементов.

С помощью PHP вы можете проверить названное скрытое поле на 0 (не установлено) или 1 (установлено).

person Marcel Ennix    schedule 10.09.2014
comment
Почему у вас не может быть пробелов или разрывов строк между двумя элементами? - person Be Kind To New Users; 30.12.2015
comment
@MichaelPotter: this.previousSibling получит пробелы как брат, поэтому он не работает. - person Marcel Ennix; 01.02.2016
comment
О, это ИДЕАЛЬНО! Это решает проблему размещения нескольких наборов полей с повторяющимися именованными полями. Ни одно из других решений этого не делает. Используя метод Марселя, ваши опубликованные поля будут иметь массивы одинаковой длины. Итак, следующий сценарий: <fieldset name='fs1'> <input type="text" name="somefield[]"> <input type="checkbox" name="live[]"> </fieldset> <fieldset name='fs2'> <input type="text" name="somefield[]"> <input type="checkbox" name="live[]"> </fieldset> * Предположим, там были новые строки. Кажется, они не работают в блоках кода мини-разметки - person Brian Layman; 16.01.2017
comment
Это должен быть принятый ответ. Работает с массивами (ex / name = soup []) - person jdavid05; 14.05.2019
comment
Вы можете использовать previousElementSibling вместо previousSibling. Он поддерживается почти везде и игнорирует текстовые узлы. - person MarSoft; 26.06.2019
comment
Это не сработает, если флажок установлен с использованием JS или по умолчанию установлен флажок. Чтобы исправить последнее, вы можете `onclick = this.previousElementSibling.name = this.checked? ': This.name - person oriadam; 11.08.2019

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

Если вы добавите этот код:

<form>
  <input type='hidden' value='0' name='selfdestruct'>
  <input type='checkbox' value='1' name='selfdestruct'>
</form>

Браузеру все равно, что вы здесь делаете. Браузер отправит на сервер оба параметра, и сервер должен решить, что с ними делать.

Например, PHP принимает последнее значение как используемое (см .: Авторитетное положение повторяющихся ключей запроса HTTP GET)

Но другие системы, с которыми я работал (на основе Java), делают это наоборот - они предлагают вам только первое значение. .NET вместо этого предоставит вам массив с обоими элементами.

Я попытаюсь когда-нибудь проверить это с помощью node.js, Python и Perl.

person SimonSimCity    schedule 23.01.2012
comment
ruby и node.js будут принимать последнее значение любых дублированных полей формы. По этой причине вспомогательные методы Ruby on Rails создают флажки подобным образом. - person nzifnab; 15.05.2012
comment
Вкратце - это основано на атаке под названием «Загрязнение параметров HTTP» и было проанализировано OWASP: owasp.org/images/b/ba/AppsecEU09_CarettoniDiPaola_v0.8.pdf (стр. 9), где вы можете найти список из 20 систем и посмотреть, как они с этим справляются. - person SimonSimCity; 06.09.2012
comment
Java Servlets дает вам все, если вы вызываете request.getParameterValues - person mauhiz; 17.09.2014

вам не нужно создавать скрытое поле для всех флажков, просто скопируйте мой код. он изменит значение флажка, если он не установлен, value назначит 0, а если флажок установлен, тогда назначит value на 1

$("form").submit(function () {

    var this_master = $(this);

    this_master.find('input[type="checkbox"]').each( function () {
        var checkbox_this = $(this);


        if( checkbox_this.is(":checked") == true ) {
            checkbox_this.attr('value','1');
        } else {
            checkbox_this.prop('checked',true);
            //DONT' ITS JUST CHECK THE CHECKBOX TO SUBMIT FORM DATA    
            checkbox_this.attr('value','0');
        }
    })
})
person Rameez SOOMRO    schedule 13.12.2013
comment
Это решение работает лучше и элегантнее, чем загрязнение Dom скрытыми полями. - person Prasad Paranjape; 21.07.2015
comment
Это приводит к тому, что поле временно проверяется во время отправки формы. Это сбивает (в лучшем случае) пользователя с толку. - person Mark Fraser; 24.08.2015

Распространенный прием - переносить скрытую переменную вместе с каждым флажком.

<input type="checkbox" name="mycheckbox" />
<input type="hidden" name="mycheckbox.hidden"/>

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

Алгоритм на стороне сервера, вероятно, будет выглядеть так:

for input in form data such that input.name endswith .hidden
  checkboxName = input.name.rstrip('.hidden')
  if chceckbName is not in form, user has unchecked this checkbox

Вышеупомянутое не совсем отвечает на вопрос, но предоставляет альтернативные средства достижения аналогичной функциональности.

person Shailesh Kumar    schedule 27.11.2009
comment
не работает с Perl CGI :: Simple - он все равно будет создавать слишком короткий массив элементов mycheckbox, чтобы вы не знали, какие из них отсутствуют. - person kbro; 23.10.2020

$('input[type=checkbox]').on("change",function(){
    var target = $(this).parent().find('input[type=hidden]').val();
    if(target == 0)
    {
        target = 1;
    }
    else
    {
        target = 0;
    }
    $(this).parent().find('input[type=hidden]').val(target);
});

<p>
    <input type="checkbox" />
    <input type="hidden" name="test_checkbox[]" value="0" />
</p>
<p>
    <input type="checkbox" />
    <input type="hidden" name="test_checkbox[]" value="0" />
</p>
<p>
    <input type="checkbox" />
    <input type="hidden" name="test_checkbox[]" value="0" />
</p>

Если вы не укажете название флажка, оно не будет передано. Только массив test_checkbox.

person Jeremy    schedule 14.01.2013
comment
Отличное решение, но в моем случае live () не работает, поэтому я использовал метод on (): $ ('input [type = checkbox]'). On (change, function () {...}); - person Massa; 31.07.2014
comment
LIVE устарел. Больше не используйте его для ответов в stackoverflow. Амем. - person Ismael; 15.09.2014
comment
Этот ответ действительно лучший .. Он работает, как и ожидалось. Даже для флажка группы. - person Alemoh Rapheal Baja; 10.06.2020

Вы можете использовать Javascript в событии отправки формы. Это все, что вы можете сделать, браузеры не могут сделать это сами по себе. Это также означает, что ваша форма не работает для пользователей без Javascript. Лучше знать на сервере, какие есть флажки, чтобы вы могли сделать вывод, что те, которые отсутствуют в опубликованных значениях формы ($_POST в PHP), не отмечены.

person Bart van Heukelom    schedule 27.11.2009
comment
начиная с php 4.1 вы также можете использовать $ _REQUEST php.net/manual/en/reserved .variables.request.php - person Karl Adler; 23.04.2013
comment
$_REQUEST - это хорошая практика, поскольку она позволяет повторно использовать некоторый код, если ваш сценарий поддерживает оба метода. - person nullability; 12.07.2013

Я знаю, что этому вопросу 3 года, но я нашел решение, которое, на мой взгляд, работает очень хорошо.

Вы можете проверить, назначена ли переменная $ _POST, и сохранить ее в переменной.

$value = isset($_POST['checkboxname'] ? 'YES' : 'NO';

функция isset () проверяет, назначена ли переменная $ _POST. По логике, если он не назначен, флажок не ставится.

person Riley Stadel    schedule 09.08.2018
comment
Это намного лучше, поскольку самый популярный ответ - ужасное решение для программ чтения с экрана. - person Kevin Waterson; 28.01.2020
comment
У этого ответа должно быть больше голосов. Это просто и без накладных расходов. - person Talha Imam; 19.02.2021
comment
Это потому, что у вас есть только 1 флажок, если у вас есть несколько флажков для отправки, и вы заботитесь о сортировке флажков, это решение не будет работать - person Jacky Chong; 26.02.2021

Я бы сделал следующее.

У меня есть скрытое поле ввода с тем же именем с флажком ввода

<input type="hidden" name="checkbox_name[]" value="0" />
<input type="checkbox" name="checkbox_name[]" value="1" />

а затем, когда я публикую, я в первую очередь удаляю повторяющиеся значения, взятые в массиве $ _POST, а затем отображаю каждое из уникальных значений.

  $posted = array_unique($_POST['checkbox_name']);
  foreach($posted as $value){
    print $value;
  }

Я получил это из сообщения удалить повторяющиеся значения из массива

person desw    schedule 22.04.2013
comment
Какова цель [] в значении поля имени? - person Be Kind To New Users; 30.12.2015
comment
@MichaelPotter Это так, когда сообщение отправляется в PHP, оно будет читать имя `checkbox_name [] - person Twister1002; 13.01.2016
comment
@ Twister1002, я думаю, вы описали назначение атрибута name, а не цель добавления [] к имени. Я выполнил поиск в Интернете и, похоже, некоторые люди делают это с именами: groupname [elementname], чтобы сгруппировать поля вместе, но я не нашел объяснения для empty []. - person Be Kind To New Users; 13.01.2016
comment
@MichaelPotter Извините, я думал, что закончил это заявление. Но, видимо, нет. Позвольте мне переделать это. Когда он будет отправлен на php, процессор PHP прочитает его как массив. Таким образом, с каждым именем checkbox_name[] каждое значение будет введено в массив, который затем можно будет извлечь. Пример: $_POST['checkbox_name'][0] и т. Д. С увеличением количества полей с одинаковыми именами. Другой пример: если у вас есть три поля с именем field_name[], вы можете получить второе значение field_name, например $_POST['field_name'][1]. Его назначение может быть удивительным, если у вас есть несколько полей с одинаковыми именами. - person Twister1002; 13.01.2016

«Я выбрал серверный подход. Кажется, все работает нормально - спасибо. --Reach4thelasers, 1 декабря 2009 г., 15:19» Я хотел бы порекомендовать это от владельца. Как процитировано: решение javascript зависит от того, как обработчик сервера (я не проверял)

Такие как

if(!isset($_POST["checkbox"]) or empty($_POST["checkbox"])) $_POST["checkbox"]="something";
person N Zhang    schedule 27.02.2013

Большинство ответов здесь требуют использования JavaScript или дублирования элементов управления вводом. Иногда это нужно делать полностью на стороне сервера.

Я считаю, что (предполагаемый) ключ к решению этой общей проблемы - это элемент управления вводом при отправке формы.

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

  1. Названия флажков
  2. Имя элемента ввода для отправки формы

Проверяя, была ли форма отправлена ​​(элементу ввода отправки присваивается значение), можно предполагать любые снятые значения флажков.

Например:

<form name="form" method="post">
  <input name="value1" type="checkbox" value="1">Checkbox One<br/>
  <input name="value2" type="checkbox" value="1" checked="checked">Checkbox Two<br/>
  <input name="value3" type="checkbox" value="1">Checkbox Three<br/>
  <input name="submit" type="submit" value="Submit">
</form>

При использовании PHP довольно просто определить, какие флажки были отмечены.

<?php

$checkboxNames = array('value1', 'value2', 'value3');

// Persisted (previous) checkbox state may be loaded 
// from storage, such as the user's session or a database.
$checkboxesThatAreChecked = array(); 

// Only process if the form was actually submitted.
// This provides an opportunity to update the user's 
// session data, or to persist the new state of the data.

if (!empty($_POST['submit'])) {
    foreach ($checkboxNames as $checkboxName) {
        if (!empty($_POST[$checkboxName])) {
            $checkboxesThatAreChecked[] = $checkboxName;
        }
    }
    // The new state of the checkboxes can be persisted 
    // in session or database by inspecting the values 
    // in $checkboxesThatAreChecked.
    print_r($checkboxesThatAreChecked);
}

?>

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

person Werner    schedule 14.04.2015

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

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

Для серверной части, где используется первое вхождение (JSP), вы должны сделать следующее.

  <input type="checkbox" value="1" name="checkbox_1"/>
  <input type="hidden" value="0" name="checkbox_1"/>


Для серверной части, где используется последнее вхождение (PHP, Rails), вы должны сделать следующее.

  <input type="hidden" value="0" name="checkbox_1"/>
  <input type="checkbox" value="1" name="checkbox_1"/>


Для серверной части, где все вхождения хранятся в типе данных списка (_3 _, _ 4_). (Python / Zope)

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


Для серверной части, где все вхождения объединены запятой (ASP.NET / IIS) Вам потребуется (разделить / расчленить) строку, используя запятую в качестве разделителя, чтобы создать тип данных списка. ([])

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

Обработка параметров серверной части

источник изображения

person TarranJones    schedule 04.01.2016

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

Я разработал идею Шайлеша на PHP, у меня она работает. Вот мой код:

/* Delete '.hidden' fields if the original is present, use '.hidden' value if not. */
foreach ($_POST['frmmain'] as $field_name => $value)
{
    // Only look at elements ending with '.hidden'
    if ( !substr($field_name, -strlen('.hidden')) ) {
        break;
    }

    // get the name without '.hidden'
    $real_name = substr($key, strlen($field_name) - strlen('.hidden'));

    // Create a 'fake' original field with the value in '.hidden' if an original does not exist
    if ( !array_key_exists( $real_name, $POST_copy ) ) {
        $_POST[$real_name] = $value;
    }

    // Delete the '.hidden' element
    unset($_POST[$field_name]);
}
person Wouter    schedule 08.03.2011

Я использую этот блок jQuery, который добавит скрытый ввод во время отправки для каждого снятого флажка. Это гарантирует, что вы всегда будете получать значение, отправленное для каждого флажка, каждый раз, не загромождая разметку и не рискуя забыть сделать это для флажка, который вы добавите позже. Он также не зависит от того, какой бэкэнд-стек (PHP, Ruby и т. Д.) Вы используете.

// Add an event listener on #form's submit action...
$("#form").submit(
    function() {

        // For each unchecked checkbox on the form...
        $(this).find($("input:checkbox:not(:checked)")).each(

            // Create a hidden field with the same name as the checkbox and a value of 0
            // You could just as easily use "off", "false", or whatever you want to get
            // when the checkbox is empty.
            function(index) {
                var input = $('<input />');
                input.attr('type', 'hidden');
                input.attr('name', $(this).attr("name")); // Same name as the checkbox
                input.attr('value', "0"); // or 'off', 'false', 'no', whatever

                // append it to the form the checkbox is in just as it's being submitted
                var form = $(this)[0].form;
                $(form).append(input);

            }   // end function inside each()
        );      // end each() argument list

        return true;    // Don't abort the form submit

    }   // end function inside submit()
);      // end submit() argument list
person Matt Holden    schedule 17.04.2016

Вы также можете перехватить событие form.submit и выполнить обратную проверку перед отправкой

$('form').submit(function(event){
    $('input[type=checkbox]').prop('checked', function(index, value){
        return !value;
    });
});
person Jimchao    schedule 04.12.2012

Я вижу, что этот вопрос старый и на него так много ответов, но я все равно отдам свою копейку. Я голосую за решение javascript в событии отправки формы, как отмечали некоторые. Никакого дублирования входных данных (особенно если у вас длинные имена и атрибуты с PHP-кодом, смешанным с html), никаких проблем на стороне сервера (для этого потребуется знать все имена полей и проверять их по одному), просто выберите все непроверенные элементы присвойте им значение 0 (или все, что вам нужно, чтобы указать статус «не проверено»), а затем измените их атрибут «проверено» на true

    $('form').submit(function(e){
    var b = $("input:checkbox:not(:checked)");
    $(b).each(function () {
        $(this).val(0); //Set whatever value you need for 'not checked'
        $(this).attr("checked", true);
    });
    return true;
});

таким образом у вас будет такой массив $ _POST:

Array
(
            [field1] => 1
            [field2] => 0
)
person MarcoSpada    schedule 28.02.2016
comment
Не работает на моей стороне. Пытаюсь сделать это, но все флажки не выставляются. [код] $ (# фильтр input) .change (function (e) {console.log ('sublmit'); var b = $ (input: checkbox: not (: checked)); $ (b) .each (function () {$ (this) .val (2); $ (this) .attr (проверено, истина);}); $ (# filter) .submit ();}); [/код] - person lio; 17.01.2018
comment
Сделал трюк для меня. Единственный недостаток - при отправке формы становились отмечены все флажки. Это может сбивать с толку пользователя, но поскольку страница перезагружается после отправки формы, я думаю, что это незначительная проблема. - person Oksana Romaniv; 07.03.2018
comment
Как сказала Оксана, он проверяет все флажки, включая любые обязательные флажки, которые пользователь не выбирал сам, позволяя отправить форму без согласия пользователя с некоторыми условиями. - person bskool; 22.11.2018

То, что я сделал, было немного другим. Сначала я изменил значения всех неотмеченных флажков. На «0», затем выбрал их все, чтобы значение было отправлено.

function checkboxvalues(){
  $("#checkbox-container input:checkbox").each(function({ 
    if($(this).prop("checked")!=true){
      $(this).val("0");
      $(this).prop("checked", true);
    }
  });
}

person IgorAgatti    schedule 21.04.2015
comment
Ответ хороший, но я хочу знать, отличается ли он от ответа @Rameez SOOMRO? - person Imran Qamer; 10.05.2016
comment
Аналогичный конечный результат, только так вы не меняете значения отмеченных флажков. - person IgorAgatti; 11.05.2016

Я бы предпочел сопоставить $ _POST

if (!$_POST['checkboxname']) !$_POST['checkboxname'] = 0;

он имеет в виду, что если POST не имеет значения 'checkboxname', он был отключен, поэтому присвойте значение.

вы можете создать массив значений вашего ckeckbox и создать функцию, которая проверяет, существуют ли значения, если нет, она думает, что они не отмечены, и вы можете присвоить значение

person Felipe Gonzalez    schedule 23.08.2015

Пример действий Ajax: (': checked') используется jQuery вместо .val ();

            var params = {
                books: $('input#users').is(':checked'),
                news : $('input#news').is(':checked'),
                magazine : $('input#magazine').is(':checked')
            };

params получит значение ИСТИНА ИЛИ ЛОЖЬ ..

person Mehmet Ali Uysal    schedule 25.02.2014

Флажки обычно представляют двоичные данные, которые хранятся в базе данных, как значения Да / Нет, Да / Нет или 1/0. Флажки HTML имеют плохую природу отправлять значение на сервер, только если флажок установлен! Это означает, что серверный сценарий на другом сайте должен заранее знать, какие есть все возможные флажки на веб-странице, чтобы иметь возможность хранить положительные (проверенные) или отрицательные (неотмеченные) значения. На самом деле только отрицательные значения являются проблемой (когда пользователь снимает отметку с ранее (предварительно) отмеченного значения - как сервер может узнать об этом, если ничего не отправлено, если он не знает заранее, что это имя должно быть отправлено). Если у вас есть сценарий на стороне сервера, который динамически создает сценарий UPDATE, возникает проблема, потому что вы не знаете, какие все флажки должны быть получены, чтобы установить значение Y для отмеченных и значение N для непроверенных (не полученных).

Поскольку я храню значения «Y» и «N» в своей базе данных и представляю их с помощью отмеченных и снятых флажков на странице, я добавил скрытое поле для каждого значения (флажок) со значениями «Y» и «N», а затем использую флажки только для визуального отображения. представление и используйте простую функцию JavaScript check (), чтобы установить значение if в соответствии с выбором.

<input type="hidden" id="N1" name="N1" value="Y" />
<input type="checkbox"<?php if($N1==='Y') echo ' checked="checked"'; ?> onclick="check(this);" />
<label for="N1">Checkbox #1</label>

используйте один прослушиватель onclick JavaScript и вызовите функцию check () для каждого флажка на моей веб-странице:

function check(me)
{
  if(me.checked)
  {
    me.previousSibling.previousSibling.value='Y';
  }
  else
  {
    me.previousSibling.previousSibling.value='N';
  }
}

Таким образом, значения «Y» или «N» всегда отправляются в сценарий на стороне сервера, он знает, какие поля должны быть обновлены, и нет необходимости преобразовывать значение флажка «включено» в значение «Y» или флажок «Не получен» в «N». '.

ПРИМЕЧАНИЕ: пробел или новая строка также являются родственными, поэтому здесь мне нужен .previousSibling.previousSibling.value. Если между ними нет пробела, только .previousSibling.value


Вам не нужно явно добавлять прослушиватель onclick, как раньше, вы можете использовать библиотеку jQuery для динамического добавления прослушивателя щелчка с функцией для изменения значения для всех флажков на вашей странице:

$('input[type=checkbox]').click(function()
{
  if(this.checked)
  {
    $(this).prev().val('Y');
  }
  else
  {
    $(this).prev().val('N');
  }
});
person sbrbot    schedule 15.09.2014

@cpburnz понял это правильно, но для большого количества кода вот та же идея, но с меньшим количеством кода:

JS:

// jQuery OnLoad
$(function(){
    // Listen to input type checkbox on change event
    $("input[type=checkbox]").change(function(){
        $(this).parent().find('input[type=hidden]').val((this.checked)?1:0);
    });
});

HTML (обратите внимание на имя поля, используя имя массива):

<div>
    <input type="checkbox" checked="checked">
    <input type="hidden" name="field_name[34]" value="1"/>
</div>
<div>
    <input type="checkbox">
    <input type="hidden" name="field_name[35]" value="0"/>
</div>
<div>

А для PHP:

<div>
    <input type="checkbox"<?=($boolean)?' checked="checked"':''?>>
    <input type="hidden" name="field_name[<?=$item_id?>]" value="<?=($boolean)?1:0?>"/>
</div>
person Rodrigo Polo    schedule 22.10.2014

Все ответы хороши, но если у вас есть несколько флажков в форме с тем же именем, и вы хотите опубликовать статус каждого флажка. Затем я решил эту проблему, разместив скрытое поле с флажком (имя, соответствующее тому, что я хочу).

<input type="hidden" class="checkbox_handler" name="is_admin[]" value="0" />
<input type="checkbox" name="is_admin_ck[]" value="1" />

затем контролируйте статус изменения флажка с помощью кода jquery ниже:

$(documen).on("change", "input[type='checkbox']", function() {
    var checkbox_val = ( this.checked ) ? 1 : 0;
    $(this).siblings('input.checkbox_handler').val(checkbox_val);
});

теперь при изменении любого флажка изменится значение связанного скрытого поля. А на сервере вы можете смотреть только в скрытые поля вместо флажков.

Надеюсь, это поможет кому-то решить эту проблему. радость :)

person Imran Khan    schedule 21.05.2015

Вы можете добавить скрытые элементы перед отправкой формы.

$('form').submit(function() {
  $(this).find('input[type=checkbox]').each(function (i, el) {
    if(!el.checked) {
      var hidden_el = $(el).clone();
      hidden_el[0].checked = true;
      hidden_el[0].value = '0';
      hidden_el[0].type = 'hidden'
      hidden_el.insertAfter($(el));
    }
  })
});
person SergA    schedule 23.07.2015

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

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

if(!isset($_POST['checkbox1']))
{
     $checkboxValue = false;
} else {
     $checkboxValue = $_POST['checkbox1'];
}

Но если вы создали динамическую форму, вы не всегда будете знать атрибут имени ваших флажков, если вы не знаете имя флажка, вы не можете использовать функцию isset, чтобы проверить, было ли это отправлено с переменная $ _POST.

person Daniel Galecki    schedule 26.01.2016

Если вы хотите отправить массив значений флажков (включая неотмеченные элементы), вы можете попробовать что-то вроде этого:

<form>
<input type="hidden" value="0" name="your_checkbox_array[]"><input type="checkbox">Dog
<input type="hidden" value="0" name="your_checkbox_array[]"><input type="checkbox">Cat
</form>

$('form').submit(function(){
    $('input[type="checkbox"]:checked').prev().val(1);
});
person Michael    schedule 18.08.2017
comment
Это точный ответ, который я искал. Спасибо @Michael - person Neo; 11.10.2020

Когда флажок не установлен при отправке, обновите значение флажка на «НЕТ» и установите флажок «ИСТИНА».

https://jsfiddle.net/pommyk/8d9jLrvo/26/

$(document).ready(function() 
{
  function save() 
  {
    if (document.getElementById('AgeVerification').checked == false) 
    {
      document.getElementById('AgeVerification').value = 'no';
      document.getElementById('AgeVerification').checked = true;     
    }
  }
  document.getElementById("submit").onclick = save;
})
person pkamathk    schedule 18.04.2018

Для флажка простой способ сделать это без использования значения скрытого типа:

<form>
    <input type='checkbox' name='selfdestruct' value='1'>
</form>

В PHP для опубликованных данных формы:

// Sanitize form POST data
$post = filter_var_array($_POST, FILTER_SANITIZE_STRING);

// set the default checkbox value
$selfDestruct = '0';
if(isset($post["selfdestruct"]))
    $selfDestruct = $post["selfdestruct"];
person Carl Barrett    schedule 18.04.2021

Есть способ лучше. Прежде всего укажите атрибут name только для тех флажков, которые отмечены. Затем, щелкнув submit, с помощью JavaScript function вы установите все снятые флажки. Итак, когда вы submit, в form collection будут извлекаться только те, у кого есть name свойство.

  //removing name attribute from all checked checkboxes
                  var a = $('input:checkbox:checked');
                   $(a).each(function () {
                       $(this).removeAttr("name");        
                   });

   // checking all unchecked checkboxes
                   var b = $("input:checkbox:not(:checked)");
                   $(b).each(function () {
                       $(this).attr("checked", true);
                   });

Преимущество: не нужно создавать лишние скрытые ящики и манипулировать ими.

person Gyanesh Gouraw    schedule 30.09.2014

jQuery-версия ответа @vishnu.

if($('#testName').is(":checked")){
    $('#testNameHidden').prop('disabled', true);
}

Если вы используете jQuery 1.5 или ниже, используйте функцию .attr () вместо .prop ()

person 0x1ad2    schedule 23.10.2014

Это решение основано на решении @desw.

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

<input type="text" name="employee[]" />
<input type="hidden" name="isSingle[] value="no" />
<input type="checkbox" name="isSingle[] value="yes" />

Если вы вставляете сразу трех сотрудников, а первый и второй - одиночные, вы получите массив isSingle из 5 элементов, поэтому вы не сможете выполнить итерацию сразу по трем массивам, чтобы, для Например, вставить сотрудников в базу данных.

Вы можете преодолеть это с помощью простой постобработки массива. Я использую PHP на стороне сервера и сделал следующее:

$j = 0;
$areSingles = $_POST['isSingle'];
foreach($areSingles as $isSingle){
  if($isSingle=='yes'){
    unset($areSingles[$j-1]);
  }
  $j++;
}
$areSingles = array_values($areSingles);
person Pere    schedule 20.01.2015

Таким образом, это решение является излишним для этого вопроса, но оно помогло мне, когда у меня был один и тот же флажок, который появлялся много раз для разных строк в таблице. Мне нужно было знать строку, представленную флажком, а также знать состояние флажка (отмечен / не отмечен).

Что я сделал, так это убрал атрибут name с моих входов флажка, дал им все тот же класс и создал скрытый вход, который будет содержать JSON-эквивалент данных.

HTML

 <table id="permissions-table">
    <tr>
	<td>
	    <input type="checkbox" class="has-permission-cb" value="Jim">
	    <input type="checkbox" class="has-permission-cb" value="Bob">
	    <input type="checkbox" class="has-permission-cb" value="Suzy">
	</td>
    </tr>
 </table>
 <input type="hidden" id="has-permissions-values" name="has-permissions-values" value="">

Javascript для запуска при отправке формы

var perms = {};
$(".has-permission-checkbox").each(function(){
  var userName = this.value;
  var val = ($(this).prop("checked")) ? 1 : 0
  perms[userName] = {"hasPermission" : val};
});
$("#has-permissions-values").val(JSON.stringify(perms));

Строка json будет передана с формой как $ _POST ["has-permissions-values"]. В PHP декодируйте строку в массив, и у вас будет ассоциативный массив, содержащий каждую строку и значение true / false для каждого соответствующего флажка. Затем очень легко пройти и сравнить с текущими значениями базы данных.

person Tmac    schedule 18.02.2015

Я предпочитаю оставаться с решениями, которые не требуют javascript (и да, я знаю, что будут некоторые, которые теперь относят меня к категории луддитов), но если вы похожи на меня, и вы хотите иметь возможность отображать настройки по умолчанию / начальные настройки для установите флажок, а затем удерживайте или обновляйте его в зависимости от отправляемой формы, попробуйте это (основанное на нескольких идеях выше):

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

В приведенном ниже примере создается массив массивов (для использования в WordPress; работает одинаково хорошо в других местах), а затем определяется состояние флажка с помощью серверного скрипта без использования скрытых полей или javascript.

<?php

$options_array = array (
    array('list_companies_shortcode' , 'shortcode_list_companies' , 'List Companies Shortcode'),
    array('list_contacts_shortcode' , 'shortcode_list_contacts' , 'List Contacts Shortcode'),
    array('test_checkbox_1' , 'checked' , 'Label for Checkbox 1' , 'checkbox' , 'Some text to instruct the user on this checkbox use' ),
    array('test_checkbox_2' , '' , 'Label for Checkbox 2' , 'checkbox' , 'Some other text to instruct the user on this checkbox use' )
 ) ;


$name_value_array = array() ;
$name_label_array = array() ;
$field_type_array = array() ;
$field_descriptor_array = array() ;
foreach ( $options_array as $option_entry ) {
    $name_value_array[ $option_entry[0] ] = $option_entry[1] ;
    $name_label_array[ $option_entry[0] ] = $option_entry[2] ;
    if ( isset( $option_entry[3] ) ) {
        $field_type_array[ $option_entry[0] ] = $option_entry[3] ;
        $field_descriptor_array[ $option_entry[0] ] = $option_entry[4] ;
    } else {
        $field_type_array[ option_entry[0] ] = 'text' ;
        $field_descriptor_array[ $option_entry[0] ] = NULL ;
    } 
}

echo "<form action='' method='POST'>" ;
    foreach ( $name_value_array as $setting_name => $setting_value ) {
        if ( isset( $_POST[ 'submit' ] ) ) {
            if ( isset( $_POST[ $setting_name ] ) ) {
                $setting_value = $_POST[ $setting_name ] ;
            } else {
                $setting_value = '' ;
            }
        }   
        $setting_label = $option_name_label_array[ $setting_name ] ;
        $setting_field_type = $field_type_array[ $setting_name ] ;
        $setting_field_descriptor = $field_descriptor_array [ $setting_name ] ;
        echo "<label for=$setting_name >$setting_label</label>" ;
        switch ( $setting_field_type ) {
            case 'checkbox':
                echo "<input type='checkbox' id=" . $setting_name . " name=" . $setting_name . " value='checked' " . $setting_value . " >(" . $setting_field_descriptor . ")</input><br />" ;
                break ;
            default:
                echo "<input type='text' id=" . $setting_name . " name=" . $setting_name . " value=" . $setting_value . " ></input><br />" ;
        }
    }
    echo "<input type='submit' value='Submit' name='submit' >" ;
echo "</form>" ;
person Ramblin    schedule 04.10.2015

<input type="checkbox" id="checkbox" name="field_name" value="1">

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

isset($_POST['field_name']) ? $entity->attribute = $_POST['field_name'] : $entity->attribute = 0;

Использование обычного оператора IF:

if (isset($_POST['field_name'])) {
    $entity->attribute = $_POST['field_name'];
} else {
    $entity->attribute = 0;
}
person micaelsf    schedule 06.08.2017
comment
Что делать, если у вас есть несколько флажков с одинаковыми именами, и вы получаете массив? Вы не можете узнать, какой это индекс, если некоторые из них не отмечены ... - person trainoasis; 15.12.2017

Однострочное решение:

$option1ChkBox = array_key_exists('chkBoxName', $_POST) ? true : false;
person zsearthas    schedule 22.11.2017
comment
Это никоим образом не меняет способ отправки данных, потому что это только на стороне сервера. OP хочет, чтобы процесс отправки, выполняемый клиентом, был изменен. - person jlh; 22.11.2017

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

HTML

Initialy checked
<span><!-- set the check attribute for the one that represents the initial value-->
<input type="radio" name="a" value="1" checked>
<input type="radio" name="a" value="0">
</span>

<br/>
Initialy unchecked
<span><!-- set the check attribute for the one that represents the initial value-->
<input type="radio" name="b" value="1">
<input type="radio" name="b" value="0" checked>
</span>

и CSS

span input
{position: absolute; opacity: 0.99}

span input:checked
{z-index: -10;}

span input[value="0"]
{opacity: 0;}

скрипка здесь

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

person frag    schedule 21.02.2018

Самое простое решение - фиктивный флажок плюс скрытый ввод, если вы используете jquery:

 <input id="id" type="hidden" name="name" value="1/0">
 <input onchange="$('#id').val(this.checked?1:0)" type="checkbox" id="dummy-id" 
 name="dummy-name" value="1/0" checked="checked/blank">

Установите значение в текущее значение 1/0 для начала для ОБЕИХ входов и отметьте = проверено, если 1. Поле ввода (активное) теперь всегда будет отображаться как 1 или 0. Кроме того, этот флажок можно было щелкнуть более одного раза раньше. представление и по-прежнему работать правильно.

person Ian    schedule 07.02.2020

«У меня есть множество флажков, которые по умолчанию отмечены» - вот как я решил свою проблему:

  1. if (($ C1) OR ($ C2) OR ... ($ C18)) {echo "некоторые проверены!";} else {$ C1 = 'set'; $ C2 = 'set'; $ C3 = 'установить'; $ C4 = 'установить'; $ C5 = 'установить'; $ C6 = 'установить'; $ C7 = 'установить'; $ C8 = 'установить'; $ C9 = 'установить'; $ C10 = 'установить'; $ C11 = 'установить'; $ C12 = 'установить'; $ C13 = 'установить'; $ C14 = 'установить'; $ C15 = 'установить'; $ C16 = 'установить'; $ C17 = 'set'; $ C18 = 'set';} // (если все не отмечены - установите для них значение 'check', так как это ваше значение по умолчанию)
  2. строка выше выполнит эхо, если некоторые из них не отмечены
  3. но отмеченные все равно будут иметь установленный параметр значения
  4. поэтому, чтобы оставить их установленными, при написании их в форме используйте if ($ C1) {echo "checked";}
  5. используйте значения в дальнейшей логике ...

!!! ограничение этого метода: вы не можете снять все отметки - все они снова будут проверены

person Sergiu    schedule 21.06.2013

Простой ответ. Если в вашем коде есть checked = "checked", измените его на unchecked = "unchecked".

поэтому ваш текст должен выглядеть примерно так:

input type = "checkbox" name = "yourchosenname" unchecked = "unchecked"

если он не содержит этого, вы всегда можете добавить его

person frosty1977    schedule 31.05.2012

person    schedule
comment
Это сработало для меня. Вместо использования .submit вы должны использовать .click. Затем удалите бит, отключающий флажки. После этого работает отлично. - person cgrouge; 01.09.2016
comment
Лучший ответ: не нужно добавлять еще один скрытый ввод для каждого - person Sky; 31.08.2017