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

小开

最佳答案

具有disabled属性的元素不会被提交，或者你可以说它们的值没有被发布(参见构建表单数据集的HTML 5规范中Step 3下的第二个项目符号)。

也就是说,

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

供参考，根据html4规范中的17.12.1:

禁用控件无法接收焦点。
在选项卡导航中跳过禁用控件。
无法成功张贴已禁用的控件。

你可以在你的情况下使用readonly属性，通过这样做，你将能够发布字段的数据。

也就是说,

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

供参考，根据html4规范中的17.12.2:

只读元素接收焦点，但用户不能修改。
选项卡导航中包含只读元素。
只读元素被成功发布。

小开

如果你绝对必须有字段禁用和传递数据，你可以使用javascript输入相同的数据到一个隐藏字段(或只是设置隐藏字段太)。这将允许您禁用它，但仍然可以发布数据，即使您要发布到另一个页面。

小开

使用Jquery和ajax发送数据，你可以解决你的问题:

<script>


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


//Rest of code
})
</script>

小开

我正在更新这个答案，因为它非常有用。只需将readonly添加到输入。

所以形式是:

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

小开

你可以完全避免禁用，这是痛苦的，因为html表单格式不会发送任何与或其他标签相关的东西。

所以你可以写成regular

<input text tag just before you have `/>

添加 readonly="readonly"

它不会禁用您的文本，但不会由用户更改，因此它像一样工作，并将通过表单发送值。如果你想让它更像标签，只需删除边框

小开

除了启用输入外，要从禁用输入中提交值，只需在提交表单时重新启用表单的所有输入。

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

小开

我发现这样更容易。只读输入字段，然后设置它的样式，以便最终用户知道它是只读的。放置在这里的输入(例如来自AJAX)仍然可以提交，不需要额外的代码。

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

小开

从语义上看，这似乎是正确的行为

我会问自己"为什么我需要提交这个值?"

如果您在表单上禁用了输入，那么您大概不希望用户直接更改值

在禁用的输入中显示的任何值都应该是

从生成表单的服务器上的值或输出
如果表单是动态的，则可以从表单上的其他输入进行计算

假设处理表单的服务器与为表单提供服务的服务器相同，那么用于再现禁用输入的值的所有信息都应该在处理时可用

事实上,来保持数据完整性——即使禁用输入的值被发送到处理服务器，你也应该验证它。这个验证需要相同级别的信息，因为您无论如何都需要重新生成值!

我几乎认为只读输入也不应该在请求中发送

很高兴被纠正，但是所有用例我可以想到哪里只读/禁用输入需要提交真的只是伪装的样式问题吗

小开

除了Tom Blodget的响应，你可以简单地添加@HtmlBeginForm作为表单动作，就像这样:

 <form id="form" method="post" action="@Html.BeginForm("action", "controller", FormMethod.Post, new { onsubmit = "this.querySelectorAll('input').forEach(i => i.disabled = false)" })"

小开

用RGBA值定义颜色

在样式下添加以下代码

<!DOCTYPE html>
<html>
<head>
<style>
#p7 {background-color:rgba(215,215,215,1);}
</style>
</head>
<body>

Disabled灰色不透明

.关闭

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


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


</form>

result

小开

简单的解决方法-只是使用隐藏字段作为选择，复选框和无线电占位符。

从这个代码到-

<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" />
<select name="gender" disabled="disabled">
<option value="male">Male</option>
<option value="female" selected>Female</option>
</select>


</form>

那个代码

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


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


<input type="hidden" name="gender" value="female" />
<select name="gender" disabled="disabled">
<option value="male">Male</option>
<option value="female" selected>Female</option>
</select>
</form>

小开

不要给'Name'属性在你的情况下<input type="textbox" value="100" disabled="disabled" /> 如果您的请求使用“ID”属性，则从不设置“ID”

小开

我有完全相同的问题，但不为我工作，因为我有选择HTML元素，它的只读状态允许更改其值。所以我在一个条件中使用select，在另一个条件中使用input:

   <% If IsEditWizard Then   %>
<%For Each item In GetCompaniesByCompanyType("ResponsibleEntity")%>
<% If item.CompanyCode.EqualsIgnoreCase(prCompany.GetAsString("LinkedCompany")) Then   %>
<input type="text" value="<%: item.CompanyName  %>" tabindex="3" size="12" maxlength="12" readonly="readonly" />
<input type="hidden" id="LinkedCompany" name="LinkedCompany" value="<%:item.CompanyCode %>" tabindex="3" size="12" maxlength="12" />
<%End If %>
<%Next %>
<%Else %>
<select id="LinkedCompany" name="LinkedCompany" class="w-auto" <%= If(IsEditWizard, "disabled", "") %>>
<option value="">Please Select</option>
<%For Each item In GetCompaniesByCompanyType("ResponsibleEntity")%>
<option value="<%:item.CompanyCode %>" <%: IIf(item.CompanyCode.EqualsIgnoreCase(prCompany.GetAsString("LinkedCompany")), "selected", String.Empty) %>><%: item.CompanyName %></option>
<%Next %>
</select>


<%End If %>