Входные данные флажка только публикуют данные, если они отмечены?

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

И если данные значения не указаны, всегда используется значение по умолчанию "on"?

Предполагая, что это правильно, это последовательное поведение во всех браузерах?

Ответ 1

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

Значение по умолчанию всегда "on", это должно быть согласованным в разных браузерах.

Это описано в рекомендации W3C HTML 4:

Флажки (и переключатели) - это переключатели вкл./выкл., которые могут переключаться пользователем. Переключатель "on", когда элемент управления проверен атрибут установлен. Когда форма отправляется, флажок "on"элементы управления могут стать успешными.

Ответ 2

В HTML каждый элемент <input/> связан с одной (но не уникальной) парой имя-значение. Эта пара отправляется в последующем запросе (в данном случае в теле запроса POST), только если <input/> "успешен".

Так что, если у вас есть эти входные данные в вашей <form> DOM:

<input type="text"     name="one"   value="foo"                        />
<input type="text"     name="two"   value="bar"    disabled="disabled" />
<input type="text"     name="three" value="first"                      />
<input type="text"     name="three" value="second"                     />

<input type="checkbox" name="four"  value="baz"                        />
<input type="checkbox" name="five"  value="baz"    checked="checked"   />
<input type="checkbox" name="six"   value="qux"    checked="checked" disabled="disabled" />
<input type="checkbox" name=""      value="seven"  checked="checked"   />

<input type="radio"    name="eight" value="corge"                      />
<input type="radio"    name="eight" value="grault" checked="checked"   />
<input type="radio"    name="eight" value="garply"                     />

Сгенерирует эти пары имя + значение, которые будут отправлены на сервер:

one=foo
three=first
three=second
five=baz
eight=grault

Заметить, что:

  • two и six были исключены, потому что у них был установлен атрибут disabled.
  • three было отправлено дважды, потому что у него было два действительных ввода с одинаковым именем.
  • four не было отправлено, потому что это checkbox, который не был checked
  • six не было отправлено, несмотря на то, что checked потому что disabled атрибут имеет более высокий приоритет.
  • seven нет отправленного атрибута name="", поэтому он не передан.

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

Фреймворки, такие как ASP.NET MVC, обходят это путем (тайно) связывания каждого ввода checkbox со hidden вводом в отображаемом HTML, например, так:

@Html.CheckBoxFor( m => m.SomeBooleanProperty )

Оказывает:

<input type="checkbox" name="SomeBooleanProperty" value="true" />
<input type="hidden"   name="SomeBooleanProperty" value="false" />

Если пользователь не установит флажок, на сервер будет отправлено следующее:

SomeBooleanProperty=false

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

SomeBooleanProperty=true
SomeBooleanProperty=false

Но сервер будет игнорировать версию =false потому что он видит версию =true, и поэтому, если он не видит =true он может определить, что флажок был отображен и что пользователь его не проверял - в отличие от SomeBooleanProperty данных SomeBooleanProperty не оказываются на всех.

Ответ 3

Если флажок не установлен, он не влияет на данные, отправленные при отправке формы.

Раздел HTML5 4.10.22.4 Создание набора данных формы описывает способ построения данных формы:

Если выполняется любое из следующих условий, пропустите эти подшаги для этого элемента: [...]

Элемент field является входным элементом, атрибут type которого находится в состоянии Checkbox, а checkness имеет значение false.

а затем по умолчанию оценивается on указано, если value отсутствует:

В противном случае, если элемент поля является входным элементом, атрибут type которого находится в состоянии "Флажок" или "Радиокнопка", выполните следующие вложенные подэтапы:

Если для элемента поля указан атрибут value, тогда пусть value будет значением этого атрибута; в противном случае пусть value будет строкой "on".

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

Подобное поведение требуется в HTML4. Разумно ожидать такого поведения от всех совместимых браузеров.

Ответ 4

Флажки отправляют значение 'on' тогда и только тогда, когда установлен флажок. При включенном флажковом значении вы можете использовать скрытые входы

JS

var chk = $('input[type="checkbox"]');
    chk.each(function(){
        var v = $(this).attr('checked') == 'checked'?1:0;
        $(this).after('<input type="hidden" name="'+$(this).attr('rel')+'" value="'+v+'" />');
    });

chk.change(function(){ 
        var v = $(this).is(':checked')?1:0;
        $(this).next('input[type="hidden"]').val(v);
    });

HTML

<label>Active</label><input rel="active" type="checkbox" />

Ответ 5

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

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

И если данные значения не указаны, всегда используется значение по умолчанию "on"?

Другие ответы подтверждают, что "on" является значением по умолчанию. Однако, если вы не заинтересованы в значении, просто используйте:

if (isset($_POST['the_checkbox'])){
    // name="the_checkbox" is checked
}

Ответ 6

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

http://www.w3.org/TR/html401/interact/forms.html#checkbox

Флажки (и переключатели) - это переключатели вкл./выкл., которые могут переключаться пользователем. Переключатель "on", когда элемент управления проверен атрибут установлен. Когда форма отправляется, флажок "on"элементы управления могут стать успешными.

Успешно определяется следующим образом:

Успешное управление является "действительным" для представления. Каждый успешный control имеет свое управляющее имя в паре с его текущим значением как часть представленный набор данных формы. Должен быть определен успешный контроль в элементе FORM и должно иметь управляющее имя.

Ответ 7

тип ввода = "скрытый" имя = "is_main" value = "0"

input type = "checkbox" name = "is_main" value = "1"

так что вы можете контролировать это, как я сделал в приложении. если он проверяет, отправьте значение 1, иначе 0

Ответ 8

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

<input type="hidden" name="foo[]" value="off"/>

<input type="checkbox" name="foo[]"/>

Затем на стороне сервера, используя небольшой алгоритм, вы можете получить что-то более похожее на HTML.

function checkboxHack(array $checkbox_input): array
{
    $foo = [];
    foreach($checkbox_input as $value) {
        if($value === 'on') {
            array_pop($foo);
        }
        $foo[] = $value;
    }
    return $foo;
}

Это будет необработанный ввод

array (
    0 => 'off',
    1 => 'on',
    2 => 'off',
    3 => 'off',
    4 => 'on',
    5 => 'off',
    6 => 'on',
),

И функция вернется

array (
    0 => 'on',
    1 => 'off',
    2 => 'on',
    3 => 'on',
)  

Ответ 9

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

Сначала я поставил скрытое поле ввода в соответствие с моим флажком, т.е.

 <td><input class = "chkhide" type="hidden" name="delete_milestone[]" value="off"/><input type="checkbox" name="delete_milestone[]"   class="chk_milestone" ></td>

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

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

  'delete_milestone' => 
array (size=7)
  0 => string 'off' (length=3)
  1 => string 'off' (length=3)
  2 => string 'off' (length=3)
  3 => string 'on' (length=2)
  4 => string 'off' (length=3)
  5 => string 'on' (length=2)
  6 => string 'off' (length=3)

Это показывает, что только 3 - й и 4 - й флажки on или checked.

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

,

Ответ 10

Также как вариант ASP.NET, за исключением того, что перед тем, как установить флажок (с тем же именем), введите скрытый ввод с тем же именем. Будут отправлены только последние значения. Таким образом, если флажок установлен, тогда его имя и значение "on" отправляются, тогда как если он не установлен, будет отправлено имя соответствующего скрытого ввода и любое другое значение, которое вы могли бы ему дать. В конце вы получите массив $_POST для чтения, со всеми отмеченными и непроверенными элементами в нем, "on" и "false" значениями, без дубликатов ключей. Легко обрабатывается на PHP.

Ответ 11

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

Получение всех снятых флажков с помощью

var checkboxQueryString;

$form.find ("input[type=\"checkbox\"]:not( \":checked\")" ).each(function( i, e ) {
  checkboxQueryString += "&" + $( e ).attr( "name" ) + "=N"
});

Ответ 12

Я решил проблему с этим кодом:

HTML-форма

<input type="checkbox" id="is-business" name="is-business" value="off" onclick="changeValueCheckbox(this)" >
<label for="is-business">Soy empresa</label>

и функцию javascript, изменив форму значения флажка:

//change value of checkbox element
function changeValueCheckbox(element){
   if(element.checked){
    element.value='on';
  }else{
    element.value='off';
  }
}

и сервер проверял, является ли сообщение данных "on" или "off". Я использовал playframework java

        final Map<String, String[]> data = request().body().asFormUrlEncoded();

        if (data.get("is-business")[0].equals('on')) {
            login.setType(new MasterValue(Login.BUSINESS_TYPE));
        } else {
            login.setType(new MasterValue(Login.USER_TYPE));
        }