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

Question

У меня есть несколько отключенных входов в форме, и я хочу отправить их на сервер, но 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>

Answer 1

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

т.е.,

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

FYI,

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

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

т.е.,

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

FYI,

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

Answer 2

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

<script>

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

    //Rest of code
    })
</script>

Answer 3

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

<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 -->
}

Answer 4

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

Answer 5

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

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

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

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

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

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

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

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

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

Answer 6

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

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

Answer 7

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

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

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

Answer 8

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

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

<input text tag just before you have `/>

добавить это readonly="readonly"

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