如果表单字段没有被修改,如何禁用jQuery中的提交按钮? [英] How to disable submit button in jQuery if form fields have not been modified?

查看:169
本文介绍了如果表单字段没有被修改,如何禁用jQuery中的提交按钮?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个包含文本字段,复选框,单选按钮和提交按钮的HTML表单。



我希望提交按钮仅在字段内容被修改。现在这里是catch:如果用户将字段内容修改为原始值,那么应该再次禁用表单按钮。


  1. 原始字段值foo=>提交按钮已禁用

  2. 用户更改字段值为bar=> li>用户将字段值更改回foo=>提交按钮再次被禁用

如何通过 jQuery ?是否有任何一种通用的解决方案或脚本,我可以用任何形式?

编辑:我所要求的不能用简单的脏状态跟踪来完成。 / p>

解决方案

使用脏状态跟踪。将一个布尔值(例如IsDirty)附加到每个输入控件,并在值更改时切换它。提交表单时,检查是否至少有一个或多个值已更改,然后提交表单。否则,向用户显示提醒。



另一种解决方案是在控件值发生更改时调用通用函数。在这个函数中,你可以设置一个全局变量(IsDirty)为真,如果改变了某些东西并且启用/禁用提交按钮。

  var isDirty = false; 

函数SomethingChanged(){
if(!isDirty)isDirty = true;
btnSubmit.disabled =!isDirty;

$ / code $


任何控制的泛函

假设:将每个控件的初始值添加到属性InitVal中。

$ p $ 函数SomethingChanged(control){
if(control.value!= control.InitVal)
control.IsDirty = true;
else
control.IsDirty = false;



$ b $ p
$ b在上面的函数中,为了使它通用,可以为每个类型分别设置函数如TextBoxChanged和DropDownChanged等,但每个控件都有以下两个属性:
$ b


  1. InitValue - 控件的初始值

  2. IsDirty - 表示控件值已更改的布尔值


I have a HTML form that contains text fields, checkboxes, radiobuttons and a submit button.

I'd like that submit button is enabled only if contents of fields are modified. Now here is the catch: if the user modifies field contents back to original values, the form button should be disabled again.

  1. Original field value "foo" => submit button is disabled
  2. User changes field value to "bar" => submit button becomes enabled
  3. User changes field value back to "foo" => submit button becomes disabled again

How to achieve this with jQuery? Are there any kind of general solution or script that I could use with any form?

Edit: What I am asking can't be done with simple dirty state tracking.

解决方案

Use dirty state tracking. Attach a boolean value (e.g. IsDirty) to every input control and toggle it whenever the value changes. While submitting the form check if atleast one or more values have changed and then submit the form. Otherwise display an alert to the user.

Another solution is to call a common function whenever a controls value changes. In this function you can set a global variable (IsDirty) to true if something changed and also enable/disable the submit button.

var isDirty = false;

function SomethingChanged(){
     if( !isDirty ) isDirty = true;
     btnSubmit.disabled = !isDirty;
}

Generic Function for any control

Assumptions: Add the initial value of each control to an attribute "InitVal"

function SomethingChanged(control){
     if( control.value != control.InitVal )
          control.IsDirty = true;
     else
          control.IsDirty = false;
}

In the above function to make it generic you can have separate functions for each type of control like TextBoxChanged and DropDownChanged etc. But have the following two attributes on each control

  1. InitValue - Initial Value of the control
  2. IsDirty - Boolean value indicating that the control's value has changed

这篇关于如果表单字段没有被修改,如何禁用jQuery中的提交按钮?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆