Отключенные формы ввода не отображаются в запросе

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

Есть ли обходной путь для этого без добавления скрытого поля?

<form action="/Media/Add">
    <input type="hidden" name="Id" value="123" />

    <!-- this does not appear in request -->
    <input type="textbox" name="Percentage" value="100" disabled="disabled" /> 

</form>

Элементы с disabledатрибутом не отправляются, или вы можете сказать, что их значения не публикуются (см. Второй пункт в разделе Шаг 3 в спецификации HTML 5 для создания набора данных формы ).

То есть,

<input type="textbox" name="Percentage" value="100" disabled="disabled" /> 

К вашему сведению, в соответствии с 17.12.1 в спецификации HTML 4:

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

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

То есть,

<input type="textbox" name="Percentage" value="100" readonly="readonly" />

К вашему сведению, в соответствии с 17.12.2 в спецификации HTML 4:

1. Элементы только для чтения получают фокус, но не могут быть изменены пользователем.
2. Элементы только для чтения включены в навигацию по вкладкам.
3. Элементы только для чтения успешно опубликованы.

Используя Jquery и отправляя данные с помощью ajax, вы можете решить вашу проблему:

<script>

$('#form_id').submit(function() {
    $("#input_disabled_id").prop('disabled', false);

    //Rest of code
    })
</script>

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

<form onsubmit="this.querySelectorAll('input').forEach(i => i.disabled = false)">
    <!-- Re-enable all input elements on submit so they are all posted, 
         even if currently disabled. -->

    <!-- form content with input elements -->
</form>

Если вы предпочитаете JQuery:

<form onsubmit="$(this).find('input').prop('disabled', false)">
    <!-- Re-enable all input elements on submit so they are all posted, 
         even if currently disabled. -->

    <!-- form content with input elements -->
</form>

Для ASP.NET MVC C # Razor вы добавляете обработчик отправки следующим образом:

using (Html.BeginForm("ActionName", "ControllerName", FormMethod.Post,
    // Re-enable all input elements on submit so they are all posted, even if currently disabled.
    new { onsubmit = "this.querySelectorAll('input').forEach(i => i.disabled = false)" } ))
{
    <!-- form content with input elements -->
}

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

Я обновляю этот ответ, так как он очень полезен. Просто добавьте readonly к входу.

Таким образом, форма будет:

<form action="/Media/Add">
    <input type="hidden" name="Id" value="123" />
    <input type="textbox" name="Percentage" value="100" readonly/>
</form>

Семантически это похоже на правильное поведение

Я хотел бы спросить себя: « Почему мне нужно представить это значение? "

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

Любое значение, отображаемое в отключенном входе, должно быть

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

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

Фактически, чтобы сохранить целостность данных - даже если значение отключенного ввода было отправлено на сервер обработки, вам действительно нужно его проверить. Эта проверка потребует того же уровня информации, что и в любом случае для воспроизведения значений!

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

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

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

<input readonly style="color: Grey; opacity: 1; ">

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

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

<input text tag just before you have `/>

Добавь это readonly="readonly"

Он не отключит ваш текст, но не изменится пользователем, поэтому он будет работать как <p>и будет отправлять значение через форму. Просто удалите границу, если хотите сделать <p>тег больше похожим на тег