禁用的表单输入未出现在请求中

本文翻译自:Disabled form inputs do not appear in the request

I have some disabled inputs in a form and I want to send them to a server, but Chrome excludes them from the request. 我在表单中有一些禁用的输入,我想将它们发送到服务器,但是Chrome将其从请求中排除。

Is there any workaround for this without adding a hidden field? 是否有任何解决方法而不添加隐藏字段?

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

#1楼

参考:https://stackoom.com/question/UrxQ/禁用的表单输入未出现在请求中


#2楼

If you absolutely have to have the field disabled and pass the data you could use a javascript to input the same data into a hidden field (or just set the hidden field too). 如果您绝对必须禁用该字段并传递数据,则可以使用javascript将相同的数据输入到隐藏字段中(或者也可以设置隐藏字段)。 This would allow you to have it disabled but still post the data even though you'd be posting to another page. 这将允许您禁用它,但是即使您要发布到另一个页面,也仍然可以发布数据。


#3楼

Using Jquery and sending the data with ajax, you can solve your problem: 使用Jquery并使用ajax发送数据,可以解决您的问题:

<script>

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

    //Rest of code
    })
</script>

#4楼

I'm updating this answer since is very useful. 我正在更新此答案,因为它非常有用。 Just add readonly to the input. 只需将readonly添加到输入中即可。

So the form will be: 因此,形式为:

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

#5楼

You can totally avoid disabling, it is painful since html form format won't send anything related to <p> or some other label. 您可以完全避免禁用它,这很痛苦,因为html表单格式不会发送与<p>或其他标签有关的任何内容。

So you can instead put regular 所以你可以放常规

<input text tag just before you have `/>

add this readonly="readonly" 添加此readonly="readonly"

It wouldn't disable your text but wouldn't change by user so it work like <p> and will send value through form. 它不会禁用您的文本,但不会被用户更改,因此它像<p>一样工作,并将通过表单发送值。 Just remove border if you would like to make it more like <p> tag 如果您想使边框更像<p>标记,请删除边框


#6楼

To post values from disabled inputs in addition to enabled inputs, you can simply re-enable all of the form's inputs as it is being submitted. 要发布来自启用的输入之外的来自禁用输入的值,您可以在提交表单时简单地重新启用所有表单输入。

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

If you prefer jQuery: 如果您更喜欢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>

For ASP.NET MVC C# Razor, you add the submit handler like this: 对于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 -->
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章