提交禁用字段答案

【问题标题】：submit disabled fields提交禁用字段
【发布时间】：2010-11-20 01:06:14
【问题描述】：

我知道 Web 表单的定义行为是不提交禁用字段...但这不是我想要的定义。我想使用 ajax 发布表单，我希望它获取所有字段，即使它们被禁用。我不想构建一个解决方法，让该字段“看起来被禁用”......或者必须在启用字段 -> 发布 -> 禁用的地方破解它。

是否可以让 ajaxSubmit() 或 serialize() 在通过 DOM 并获取值时获取禁用的字段？还是有另一个可以做到这一点的序列化插件？或者有人有我可以对这些插件之一制作的模组来使其工作吗？

还是我注定要破解它？

【问题讨论】：

解释您希望用户体验的一系列事件，然后我们可以帮助您提出解决方案。故事中肯定有其他内容，否则如果选择框将被禁用，则没有理由使用它。
这是我们想要这个功能的一个原因（在与 OP 无关的不同项目中）。我们有一个动态加载可用选项的 AJAXed 网站。在某些无法选择不同选项的情况下，我们选择一个并禁用该控件。这需要回发到服务器，因为我们需要设置。（是的，理论上，我们可以计算出后端的值是多少，但是由于逻辑已经完成，因此无需复杂化。）
好吧，我想这是一个死胡同，但有人不赞成，所以我赞成。
我不确定他的情况，但是在我提交输入列表的 ASP.net MVC 中，我遇到了类似的情况，有些可能被禁用（表示没有变化in value) 和其他可能被启用（它们的值已更改）但是，当模型绑定器提交和解析表单时，它可以方便地查看所有值，而不仅仅是启用的值。对我来说，这会有所帮助

标签： jquery html webforms

【解决方案1】：

您可以将字段设置为readonly，这将不允许更改控件的值。

编辑：您可以轻松编写一个“serializeDisabled”函数，遍历具有 name 属性的禁用表单元素，并在末尾使用 jQuery.param 函数, 生成序列化字符串：

(function ($) {
  $.fn.serializeDisabled = function () {
    var obj = {};

    $(':disabled[name]', this).each(function () { 
        obj[this.name] = $(this).val(); 
    });
    return $.param(obj);
  }
})(jQuery);

【讨论】：

你不能将
我想要这个值，因为我不想为某些字段编写特殊代码（“这个字段是禁用/选择的，所以我必须在其他地方获取值”）。我想要将值放入表单中的一致/简洁的代码，然后当这些字段被发回时，我可以使用一组代码来读取值并完成。我希望它是通用的。这篇文章不是关于概念的讨论......我正在寻找我的问题的答案
我当然可以感谢您不想过于概念化，但您想知道答案：a）不是黑客，b）做一些 html 默认情况下不做的事情。并且您希望答案尽可能广泛和通用，如果是，您完全知道它将是 HTML 原生的，并且您已经知道答案。在提到选择框之前，有一个简单的答案（来自 CMS），但是选择框细节让您的问题在概念上变得更加复杂。冷静下来，阅读我的答案的附录。
但这不是 HTML……它是 jQuery/ajax……而那些库/插件只是在 DOM 中循环并抓取字段……这很容易采取额外的选项，上面写着“也抓住禁用的字段”。我想我应该更具体地问一下：这些插件是否可以选择不忽略禁用的字段
好吧，我的 4 行函数本质上只是通过使用相同数据创建隐藏输入来表示“也抓取禁用的字段”。我有理由好奇那个“不成功”的功能是否符合您的要求。至少在 PHP 中，POST 数据由名称标识，select 元素是带有名称的元素，而不是 option。那么它不显示相同 POST 数据的多个实例吗？你怎么知道哪个被选中了？如果你给每个选项一个不同的名字，那将是无效的，在我看来，这是一个 hack。

【解决方案2】：

为什么不使用.removeAttr() 和.submit() 在提交之前简单地启用所有禁用的输入字段。

$('#my_form').submit(function(){
    $("#my_form :disabled").removeAttr('disabled');
});

【讨论】：

Why not simply enable all the disabled input fields right before the submission
是的，在我修复它之前，我们的应用程序是这样工作的。

【解决方案3】：

好吧...也许我的问题问得不够清楚...但我正在寻找的答案就在这里：

http://docs.jquery.com/Plugins:Forms#.val.28.29_becomes_.fieldValue.28.29

我在我的问题中提到了 ajaxSubmit()，它来自 jQuery Form 插件......并且在该插件内部有一个名为 fieldValue() 的方法，它接受一个名为“successful”的参数。如果您传入“true”，则插件仅返回 W3C 定义为“成功”的控件（不包括禁用的控件）。但如果将其设置为 false，则无论 W3C 定义如何，它将获取所有值。

我知道这是可能的，因为整个提交是由插件控制的，与 HTML 标准/定义无关......我只是想看看这个选项是否已经在这个插件中可用- in 或其他插件。它在此插件中可用，尽管默认行为类似于标准 HTML 提交

【讨论】：

【解决方案4】：

//jQuery('#container :input').serializeAll()

(function($j) {
  $j.fn.serializeDisabled=function(){
    var obj={};
    $j(this).filter(':input:disabled').each(function(index,domElem){
      var $this=$j(domElem);
      obj[domElem.name]=$this.val(); 
    });
    return $j.param(obj);
  };

  $j.fn.serializeAll=function(){
    $this=$j(this);
    return $this.filter(':input:enabled').serialize()+'&'+$this.serializeDisabled();
  };
})(jQuery);

【讨论】：

【解决方案5】：

首先：我真的很喜欢 CMS 的回答。简单得多。但万一这不是最好的选择......

您为什么不将 JQuery 函数绑定到表单的 onsubmit 事件，该事件遍历表单并获取表单中所有 <input>s 的输入并启用它们，然后提交表单？您是否需要知道输入是否被禁用？您是否担心启用输入会以用户关注的方式改变视觉外观？

在任何一种情况下，您都可以向您启用的元素添加一些内容。对于样式，添加一个类，使禁用的输入与启用的输入具有相同的外观。如果您需要知道哪些被禁用，请在名称或值本身中添加一些内容以指示状态。

出于好奇，您什么时候需要禁用信息？如果输入总是被禁用（意味着用户没有这样设置）你不知道这个值吗？如果输入被用户设置为禁用，你收集这些数据是不是有点欺骗性？

如果该值被禁用，因为它类似于“总计”字段，它通过 js 基于其他非禁用字段进行更新，我会使用 CMS 将其设为只读。

根据您对 CMS 的回复：

我只能想象一些选择框将被禁用但您希望将其传递回脚本的场景。我想到的主要是在选中其他选项时某些选择框会启用，但您宁愿让表单传回选择框的默认值，而不是让服务器脚本处理填充空白。

如果是这样，为什么不在隐藏输入和选择框之间设置一个切换？让两个输入的值和名称相同，但如果启用一个，则禁用另一个。这样，脚本只能看到两个输入之一，并且由于它们具有相同的名称，因此不会被捕获到数据的来源。

$('form').submit(function() {
    $('[disabled]').each(function(i) {
        d_name = $(this).attr("name");
        d_val = $(this).val();
        $(this).after(
        '<input type="hidden" name="' + d_name + '" value="' + d_val + ' />'
        );
    });
return true;
});

以防你认为我过于概念化，这里有一个简单的函数，将在用户提交时运行。请注意它是如何遍历每个禁用的元素并将新的隐藏输入添加到具有相同名称和值的 DOM 中的隐藏输入，从而确保您的服务器端脚本可以通用处理所有输入。

【讨论】：

感谢您的详细回复。如果我们想从概念上谈论事物，那么在 Windows 窗体中，无论它是否启用/禁用，您始终可以获取字段的值。一个字段有一个值......禁用它与它包含的值无关......但这是网络......我必须处理它。我有一个带有字段的表单，这些字段具有值.. 其中一个是用户无法更改的关系的下拉列表。但我希望我的生活变得轻松，所以我可以在所有字段中设置值，然后发布它们（没有黑客/技巧/解决方法）。我想我注定要失败了
如果用户无法更改，真的是下拉吗？他们是不是一枪搞定，然后它就被禁用了，还是他们曾经可以与之互动？如果他们不能与之交互，那么为什么不把它作为一个只读的普通输入呢？某些东西（我假设）必须设置它，并且某些东西可以很容易地填写文本输入，对吧？
令人沮丧的是，我敢肯定，HTML 不能满足您在 Windows 中的习惯。我真的很生气javascript不能做PHP能做的一切。但这并不意味着获得您想要的东西很简单，也不意味着每个解决方案都成为黑客攻击。据我所知，您正在使用的选择根本不是真正可选择的。无论下拉菜单以何种方式被选中然后禁用，只需将值传递给隐藏的输入。要么这样，要么处理您选择的输入不是只读的并且需要在服务器脚本中考虑它的事实。
我刚刚做了一个测试以确保我的答案中的代码确实有效。我有点紧张，浏览器不会包含提交表单后添加的任何输入（即使它被 js 函数阻止），但果然，添加的输入确实显示为另一端的提交数据。与承诺相同的名称，相同的价值。

【解决方案6】：

您也可以在提交之前使用以下方法重新启用字段：

$('#form').submit(function() {
    $('[disabled]').each(function(i) {
        var d_name = $(this).attr("name");
        var d_val = $(this).val();
        $(this).attr("disabled", false);
    });
    return true;
});

$('#form').submit();

【讨论】：

【解决方案7】：

在使用 Jquery 提交之前启用所有禁用的输入字段

   $('form').submit(function(e) {
    $(':disabled').each(function(e) {
        $(this).removeAttr('disabled');
    })
});

【讨论】：

【解决方案8】：

您可以禁用输入并在提交表单之前重新启用它们，以便在发布到服务器端时表单将包含它们

【讨论】：