Jquery判断form表单数据是否变化


Posted in Javascript onMarch 30, 2016

本文实例为大家分享了Jquery判断form表单数据是否变化的三大步骤,供大家参考,具体内容如下

1、思路为:修改时点击一行datagrid,并进行页面跳转数据绑定,在提交form时,序列号form表单,并重新获取datagrid选中的行数据,进行数据比较。</span> 

/** 
 * 判断form内属性值是否被修改 
 * 
 * @param jsonForm 对应修改的form序列化后的json数据 
 * @param row 对应datagrid选中的数据源 
 * 
 * @Return true 存在修改项 
 *     false 不存在修改项 
 */ 
isModified:function(jsonForm,row){ 
  for(key in jsonForm){ 
    //form中存在,但数据源datagrid中不存在 
    if(row[key] == undefined){ 
      continue; 
    } 
    //form中""或null,但数据源datagrid中为null或""时,不进行比较 
    if(!((jsonForm[key] == null || jsonForm[key] == '') && (row[key] == null || row[key] == ''))){ 
      //如果值不同,则返回true 
      if(jsonForm[key] != row[key]) 
        return true; 
    } 
  } 
  return false; 
}

2、获取变化的值前后变化信息,由于项目需要记录值变更记录,并保存column中英文信息,如下:

/** 
   * 获取form被修改信息 
   * 
   * @param jsonForm 对应修改的form序列化后的json数据 
   * @param row 对应datagrid选中的数据源 
   * @param columnJSModel 为表单form中name属性中英对照js,需在update.jsp中引用此js文件 
   * 
   * @Return json 数据如:[{"updateColumn":"loanRatio","updateColName":"额比例","updateContent":"由11变更为100.00"}, 
   *     {"updateColumn":"loanQuotaTypeName","updateColName":"比例形式","updateContent":"由 卡 变更为 实物"}] 
   * 
   */ 
  getModifiedField:function(jsonForm,row,columnJSModel){ 
    var modifiedArry = []; 
    var jsonArrStr = ''; 
    for(key in jsonForm){ 
      //form中存在,但数据源datagrid中不存在 
      if(row[key] == undefined){ 
        continue; 
      } 
      //form中""或null,但数据源datagrid中为null或""时,不进行比较 
      if(!((jsonForm[key] == null || jsonForm[key] == '') && (row[key] == null || row[key] == ''))){ 
        //如果值不同,则返回true 
        if(jsonForm[key] != row[key]){ 
          var jsonObj = {}; 
           
          jsonObj.updateColumn = key; 
          jsonObj.updateColName = columnJSModel[key]; 
          jsonObj.updateContent = '由'+ row[key] + '变更为' + jsonForm[key]; 
           
          modifiedArry[modifiedArry.length] = jsonObj; 
        } 
      } 
    } 
    jsonArrStr = JSON.stringify(modifiedArry); 
    //console.log(jsonArrStr); 
    return jsonArrStr; 
  }

3、其中的columnJSModel为中英对照JS实体,ratio、qutaTypeName分别对应form中的name属性名,如下:

var policyColumn = { 
     
    ratio : '比例', 
    quotaTypeName : '比例形式' 
     
};

以上就是本文的全部内容,希望对大家的学习有所帮助。

Javascript 相关文章推荐
Jquery跨域获得Json时invalid label错误的解决办法
Jan 11 Javascript
jQuery Jcrop插件实现图片选取功能
Nov 23 Javascript
javascript字符串与数组转换汇总
May 26 Javascript
DeviceOne 让你一见钟情的App快速开发平台
Feb 17 Javascript
JS中多步骤多分步的StepJump组件实例详解
Apr 01 Javascript
json格式的javascript对象用法分析
Jul 04 Javascript
AngularJS 实现JavaScript 动画效果详解
Sep 08 Javascript
微信、QQ、微博、Safari中使用js唤起App
Jan 24 Javascript
Vue 自定义指令实现一键 Copy功能
Sep 16 Javascript
详解Vscode中使用Eslint终极配置大全
Nov 08 Javascript
vue实现学生信息管理系统
May 30 Javascript
微信小程序上传帖子的实例代码(含有文字图片的微信验证)
Jul 11 Javascript
基于javascript实现tab选项卡切换特效调试笔记
Mar 30 #Javascript
javascript实现数字倒计时特效
Mar 30 #Javascript
基于javascript实现样式清新图片轮播特效
Mar 30 #Javascript
网页中JS函数自动执行常用三种方法
Mar 30 #Javascript
Jquery轮播效果实现过程解析
Mar 30 #Javascript
修复jQuery tablesorter无法正确排序的bug(加千分位数字后)
Mar 30 #Javascript
JavaScript 经典实例日常收集整理(常用经典)
Mar 30 #Javascript
You might like
基于curl数据采集之单页面采集函数get_html的使用
2013/04/28 PHP
php天翼开放平台短信发送接口实现方法
2014/12/22 PHP
分享PHP源码批量抓取远程网页图片并保存到本地的实现方法
2015/12/01 PHP
PHP连接数据库实现注册页面的增删改查操作
2016/03/27 PHP
php ajax confirm 删除实例详解
2019/03/06 PHP
基于Laravel-admin 后台的自定义页面用法详解
2019/09/30 PHP
PHP中通过getopt解析GNU C风格命令行选项
2019/11/18 PHP
Prototype使用指南之selector.js
2007/01/10 Javascript
JQuery浮动DIV提示信息并自动隐藏的代码
2010/08/29 Javascript
在JS方法中返回多个值的方法汇总
2015/05/20 Javascript
jQuery点击按钮弹出遮罩层且内容居中特效
2015/12/14 Javascript
jQuery实现简单倒计时功能的方法
2016/07/04 Javascript
使用vue编写一个点击数字计时小游戏
2016/08/31 Javascript
几行js代码实现自适应
2017/02/24 Javascript
layui中layer前端组件实现图片显示功能的方法分析
2017/10/13 Javascript
在Vue methods中调用filters里的过滤器实例
2018/08/30 Javascript
vue项目中运用webpack动态配置打包多种环境域名的方法
2019/06/24 Javascript
Vue 实现输入框新增搜索历史记录功能
2019/10/15 Javascript
ESLint 是如何检查 .vue 文件的
2020/11/30 Vue.js
深入讲解Python中面向对象编程的相关知识
2015/05/25 Python
python画柱状图--不同颜色并显示数值的方法
2018/12/13 Python
python selenium firefox使用详解
2019/02/26 Python
Python中join()函数多种操作代码实例
2020/01/13 Python
python 元组的使用方法
2020/06/09 Python
Python利用pip安装tar.gz格式的离线资源包
2020/09/14 Python
美国床垫和床上用品公司:Nest Bedding
2017/06/12 全球购物
SEPHORA丝芙兰捷克官网:购买香水、化妆品和护肤品
2018/11/26 全球购物
生物技术研究生自荐信
2013/11/12 职场文书
挂职思想汇报
2013/12/31 职场文书
社区安全检查制度
2014/02/03 职场文书
2015年转正工作总结范文
2015/04/02 职场文书
毕业论文致谢范文
2015/05/14 职场文书
干部理论学习心得体会
2016/01/21 职场文书
大学生村官驻村工作心得体会
2016/01/23 职场文书
Mysql索引失效 数据库表中有索引还是查询很慢
2022/05/15 MySQL
Python sklearn分类决策树方法详解
2022/09/23 Python