Значения отключенных входных данных не будут представлены

224

Это то, что я нашел Firebug в Firefox.

То же самое в других браузерах?

Если так, то в чем причина этого?

О, мой бог
источник
23
Вы можете установить атрибут «только для чтения». Например, Chrome отображает его как отключенное поле, но отправляет его.
peterrus

Ответы:

189

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

Дополнительная информация (раздел 17.12.1)

Определения атрибутов

disabled [CI] При установке этого элемента управления для формы этот логический атрибут отключает элемент управления для пользовательского ввода. Если установлено, атрибут disabled имеет следующие эффекты для элемента:

  • Отключенные элементы управления не получают фокус.
  • Отключенные элементы управления пропускаются во вкладках навигации.
  • Отключенные элементы управления не могут быть успешными.

Следующие элементы поддерживают атрибут disabled: BUTTON, INPUT, OPTGROUP, OPTION, SELECT и TEXTAREA.

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

Способ отображения отключенных элементов зависит от агента пользователя. Например, некоторые пользовательские агенты отключают пункты меню, ярлыки кнопок и т. Д.

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

<INPUT disabled name="fred" value="stone">

Заметка. Единственный способ динамически изменить значение атрибута disabled - через скрипт.

Азиз
источник
86
Обходной путь: добавьте <input type="hidden">элемент с тем же именем / значением, что и у отключенного ввода.
Джон Кугельман
какая-нибудь информация о том, какой браузер делает, а какой нет?
Allisone
82
используйте readonly = "readonly" вместо этого :) см. stackoverflow.com/questions/7357256/…
Adrien Be
1
@Allisone: Firefox и Chrome, похоже, подчиняются этому (отключенные данные НЕ отправляются). Не пробовал в других браузерах.
Адриен Бе
1
@JohnKugelman почему то же имя? отключенный в любом случае не будет отправлен ... может также дать истинное имя скрытому и использовать другое для отключенного
Арт
286

disabled вход не будет отправлять данные.

Используйте readonlyатрибут:

<input type="text" readonly />

Источник здесь

Фред К
источник
@FrankFang, Хорошо, но когда я передаю данные в шаблон блейда коллектива Laravel. Это не сработает. не может отправлять данные таким образом.
ssi-anik
@ ssi-anik readonlyработает, просто убедитесь, что вы передаете «name» attr на вход.
BenNov
26

Вы можете использовать три вещи для имитации инвалидов:

  1. HTML: readonlyатрибут (так что значение, представленное во входных данных, может использоваться при отправке формы. Также пользователь не может изменить входное значение)

  2. CSS: 'pointer-events':'none'(блокирует пользователя от нажатия на вход)

  3. HTML: tabindex="-1"(блокирует пользователю переход к вводу с клавиатуры)

Novice_JS
источник
22

Они не отправляются, потому что это сказано в спецификации W3C .

17.13.2 Успешный контроль

Успешный контроль «действителен» для отправки. [Надрез]

  • Отключенные элементы управления не могут быть успешными.

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

MiffTheFox
источник
2

Disabledэлементы управления не могут быть успешными, и успешный элемент управления «действителен» для отправки. По этой причине отключенные элементы управления не отправляются вместе с формой.

Хуан де Паррас
источник
1

Есть два атрибута, а именно readonlyи disabled, что может сделать пол-только для чтения входных данных. Но между ними есть небольшая разница.

<input type="text" readonly />
<input type="text" disabled />
  • readonlyАтрибут делает ваш ввод текста отключен, и пользователи не могут изменить его больше.
  • Не только disabledАтрибут сделает ваш входной текст отключенным (неизменяемым), но и не сможет быть отправлен .

JQuery подход (1):

$("#inputID").prop("readonly", true);
$("#inputID").prop("disabled", true);

JQuery подход (2):

$("#inputID").attr("readonly","readonly");
$("#inputID").attr("disabled", "disabled");

Подход JavaScript:

document.getElementById("inputID").readOnly = true;
document.getElementById("inputID").disabled = true;

PS disabledи readonlyстандартные атрибуты html. propпредставил с jQuery 1.6.

Элиас Хадизаде
источник
0

отдельные элементы управления по-прежнему кликабельны даже на атрибуте readonly

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

затем создайте JQuery, выберите изменения

$('#your_select_id').change(function () {
    $('#your_hidden_selectid').val($('#your_select_id').val());
});
Johnine
источник