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

8 回答

• 0

  “已禁用元素”属性未提交，或者您可以说它们的值未发布（请参阅the spec for building the form data set中步骤3下的第二个项目符号点） .

  即，

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

  仅供参考，

  • 禁用的控件无法获得焦点 .

  • 在选项卡导航中跳过禁用的控件 .

  • 无法成功发布已禁用的控件 .

  您可以在案例中使用 readonly 属性，这样您就可以发布您的字段数据 .

  即，

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

  仅供参考，

  • 只读元素获得焦点但用户无法修改 .

  • 只读元素包含在选项卡导航中 .

  • 只读元素已成功发布 .

  回复于 2024-05-18T13:28:57+08:00
• -6

  使用Jquery并使用ajax发送数据，您可以解决您的问题：

  <script>
  
  $('#form_id').submit(function() {
      $("#input_disabled_id").prop('disabled', false);
  
      //Rest of code
      })
  </script>
  

  回复于 2024-05-18T13:28:57+08:00
• 600

  如果您必须禁用该字段并传递数据，您可以使用javascript将相同的数据输入到隐藏字段中（或者也可以设置隐藏字段） . 这将允许您禁用它，但即使您要发布到另一个页面，仍然会发布数据 .

  回复于 2024-05-18T13:28:57+08:00
• 22

  除了启用输入之外，要发布禁用输入的值，您只需在提交时重新启用所有表单的输入 .

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

  回复于 2024-05-18T13:28:57+08:00
• 5

  我正在更新这个答案因为非常有用 . 只需将readonly添加到输入中即可 .

  所以表格将是：

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

  回复于 2024-05-18T13:28:57+08:00
• 6

  我发现这个工作更容易 . readonly输入字段，然后设置样式，以便最终用户知道它是只读的 . 这里放置的输入（例如来自AJAX）仍然可以提交，无需额外的代码 .

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

  回复于 2024-05-18T13:28:57+08:00
• 2

  从语义上讲，这感觉就像是正确的行为

  我会问自己“ Why do I need to submit this value? ”

  如果您在表单上有禁用的输入，那么可能您不希望用户直接更改该值

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

  • 从生成表单的服务器上的值输出 or

  • 如果表单是动态的，可以从表单上的其他输入中计算出来

  假设处理表单的服务器与服务它的服务器相同，则在处理时应该可以获得重现已禁用输入值的所有信息 .

  In fact, 保持数据完整性 - 即使已将禁用输入的值发送到处理服务器，您也应该对其进行验证 . This validation would require the same level of information as you would need to reproduce the values anyway!

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

  很高兴得到纠正，但 all the use cases 我能想到需要提交只读/禁用输入的地方 are really just styling issues in disguise

  回复于 2024-05-18T13:28:57+08:00
• 0

  你可以完全避免禁用，这很痛苦，因为html表单格式不会发送任何与 <p> 或其他标签相关的内容 .

  所以你可以改为定期

  <input text tag just before you have `/>
  

  添加这个 readonly="readonly"

  它不会被用户更改，因此它像 <p> 一样工作，并将通过表单发送值 . 如果你想让它更像 <p> 标签，只需删除边框

  回复于 2024-05-18T13:28:57+08:00