【问题标题】:Disable submit button unless original dynamic form data has changed除非原始动态表单数据已更改,否则禁用提交按钮
【发布时间】:2017-03-10 15:24:53
【问题描述】:

访问Disable submit button unless original form data has changed

$('form')
    .each(function(){
        $(this).data('serialized', $(this).serialize())
    })
    .on('change input', function(){
        $(this)             
            .find('input:submit, button:submit')
                .attr('disabled', $(this).serialize() == $(this).data('serialized'))
        ;
     })
    .find('input:submit, button:submit')
        .attr('disabled', true)
;

它不适用于动态加载的表单。 我应该做哪些更改才能使其与动态加载的表单一起使用?

【问题讨论】:

  • 动态创建的元素需要event delegation - $(document).on('change', 'input', function() {
  • 如何只禁用提交按钮?我的表单中有提交和取消按钮。

标签: javascript jquery asp.net-mvc forms


【解决方案1】:

我假设动态加载的表单是指由 DOM 中的脚本创建的表单。 以这种方式创建的控件在您的 DOM 中与其他控件相同。

请务必在创建表单后调用您的代码。

【讨论】:

  • 谢谢你的建议,我试过了。当我在字段中进行任何更改按钮被激活但如果将其更改回原始值提交按钮不会再次被禁用时,提交按钮在加载表单时被禁用。它适用于在 DOM 中创建的字段,但不适用于通过调用 asp.net-mvc 中的函数生成的字段。
  • 在change事件中添加console.log($(this).serialize()),看看序列化的结果是什么。可能是,其他脚本会影响表单的控件。
  • 谢谢你们的帮助..在调用我上面提到的所有字段之前发生了什么函数首先执行所以它没有序列化我的所有字段,所以我在上面开始之前添加了这一行提到函数$(document).ajaxStop(function()),它工作得很好。
  • 如何只禁用提交按钮?我的表单中有提交和取消按钮。
  • 如果取消按钮也不是提交按钮,则不应禁用它。否则我会用'.whatever' 替换'input:submit, button:submit' 选择器并将这个css 类设置为您的提交按钮
猜你喜欢
  • 1970-01-01
  • 2018-09-12
  • 1970-01-01
  • 1970-01-01
  • 2019-07-19
  • 2015-06-24
  • 2020-04-23
  • 1970-01-01
  • 2016-04-03
相关资源
最近更新 更多