ExtJS中RowEditing插件的一些使用问题及解决方法

RowEditing为grid进行行级别编辑时使用的插件,与CellEditing插件不同,编辑完一行数据,即需要保存数据。

对于RowEditing的使用官方文档中有详细的例子,本文主要解决该插件在使用中出现的一些问题及解决方式。

问题1:

新增数据或者编辑数据时,进入编辑状态后,如果编辑表单数据有效性为false时(isValid),保存(update)按钮为灰色不可用状态,即使改变数据使表单数据有效时,该按钮仍为不可用。

而官方实例中的代码中,为避免出现按钮不可用,采用新增数据直接赋值的方法:

// Create a model instance

var r = Ext.create(‘Employee‘, {

name: ‘New Guy‘,

email: ‘[email protected]‘,

start: Ext.Date.clearTime(new Date()),

salary: 50000,

active: true

});

该代码为新增一条数据,可见其将新增数据设为符合表单要求数据。

如果将其中一条数据置空,新增数据后如图1,保存按钮不可用

图片1

即使输入数据,按钮依然无法可用

图片2

问题原因:

RowEditing插件使数据进入编辑状态的方法为startEdit(record, columnHeader),该方法中其实是使用了Ext的一个内部工具类RowEditor中的startEdit(record, columnHeader)方法.

而该内部工具类的startEdit()方法使用loadRecord()将选中的数据放入form表单中进行编辑。loadRecord()方法中调用updateButton(isValid)对按钮状态进行了设置;

所以当进入编辑状态后,如果需要编辑的数据本身就存在不符合要求的字段,那么保存按钮被置为不可用状态。即使所有数据都符合要求,按钮也不可用。

问题解决:

因为只有在数据进入编辑时对按钮进行设置,后期的输入操作没有类似的操作。

内部工具类RowEditor中的方法onFieldChange()正是应对输入改变时处理错误信息显示及按钮设置的(源码不再罗列,可参考文档,注:文档中该方法没有显示在方法列表中,需要在js文件中查找)

工具类中的事件:‘fieldvaliditychange’‘validitychange’是对表单有效性改变时事件,区别为‘validitychange’针对整个表单而‘fieldvaliditychange’单个编辑框

代码:

var rowEditor = grid.plugins[0].getEditor();

rowEditor.on(‘fieldvaliditychange‘, rowEditor.onFieldChange, rowEditor);

该代码写在列表页创建之后(‘fieldvaliditychange’‘validitychange’均可)。

当编辑的数据有效性发生改变时,会自动设置保存按钮的可用状态

图片3

图片4

图片5

注:代码测试有效,需根据具体情况绑定该事件

时间: 2024-08-25 12:42:20

ExtJS中RowEditing插件的一些使用问题及解决方法的相关文章

universal image loader在listview/gridview中滚动时重复加载图片的问题及解决方法

在listview/gridview中使用UIL来display每个item的图片,当图片数量较多需要滑动滚动时会出现卡顿,而且加载过的图片再次上翻后依然会重复加载(显示设置好的加载中图片) 最近在使用UIL遇到了这个问题,相信这个问题许多使用UIL的人都碰到过 现在把解决方法贴出来给有同样问题的朋友做参考 先看下UIL的工作流程 在已经允许内存,存储卡缓存的前提下,当一个图片被请求display时,首先要判断图片是否缓存在内存中,如果false则尝试从存储卡读取,如果依然不存在最后才从网络地址

jQuery中ajax的使用与缓存问题的解决方法

jQuery中ajax的使用与缓存问题的解决方法 1:GET访问 浏览器 认为 是等幂的就是 一个相同的URL 只有一个结果[相同是指 整个URL字符串完全匹配]所以 第二次访问的时候 如果 URL字符串没变化 浏览器是 直接拿出了第一次访问的结果 POST则 认为是一个 变动性 访问 (浏览器 认为 POST的提交 必定是 有改变的) 防止 GET 的 等幂 访问 就在URL后面加上 ?+new Date();,[总之就是使每次访问的URL字符串不一样的] 设计WEB页面的时候 也应该遵守这个

VS2010中<无法打开包括文件:“iostream.h”:>错误解决方法

C/C++ code? 1 2 #include <iostream.h> 改为: C/C++ code? 1 2 #include <iostream> using namespace std; VS2010中<无法打开包括文件:"iostream.h":>错误解决方法

ajax回调函数中使用$(this)取不到对象的解决方法

如果在ajax的回调函数内使用$(this)的话,实践证明,是取不到任何对象的,需要的朋友可以参考下 $(".derek").each(function(){ $(this).click(function(){ var params = $(this).parent().serialize(); var obj=$(this).parent().siblings("div#caskContent"); var form=$(this).parent(); $.aja

Linux中npm出现npmlog找不到的解决方法

?Linux中npm出现npmlog找不到的解决方法 描述 今天在对nodejs项目进行服务器迁移的时,在新的linux服务器上输入 npm -v 命令后报 "cannot find module 'npmlog'-."的错误.找到的原因是拷贝过去的bin目录下的npm文件并没有链接到module目录下的npm-cli.js文件,所以导致在执行 npm -v 命令时,路径问题导致npmlog模块无法找到. 解决方法 解决的方法有两个,一个是删除bin目录下的npm文件,并用如下命令链接

spring加载过程中jar包加载不了,解决方法

当我们在开发spring项目时,一般会将jar包放到webInf/lib下,这样是myeclipse自动将jar包加载到tomcat中webapps下,但是当我们新建一个lib文件夹的情况下,我们add building Path时就会出错,这时候我们有个技巧供使用. 1.项目上点击右键搜索de,找到deployment assembly 目的就是将此处添加的jar包添加到系统webINF/lib路径下 来自为知笔记(Wiz) spring加载过程中jar包加载不了,解决方法

java中两double相加精度丢失问题及解决方法

在讨论两位double数0.1和0.2相加时,毫无疑问他们相加的结果是0.2.但是问题总是如此吗? 下面我们让下面两个doubles数相加,然后看看输出结果: @Test public void testBig(){ System.out.println(0.11+2001299.32); } 控制台输出2001299.4300000002 我们吃惊的发现,结果并不是我们预想的那样,这是为什么呢?又如何解决呢? 现贴出BigDecimal的一个构造函数的文档供大家参考 BigDecimal pu

linux中某个端口拒绝远程主机连接原因及解决方法

linux中某个端口拒绝远程主机连接原因及解决方法 问题描述: 比如在本机telent到192.168.8.170 主机的9000 端口,被拒绝. [[email protected] log]$ telnet 192.168.8.170 9000 Trying 192.168.8.170... telnet: connect to address 192.168.8.170: Connection refused 原因:原因有两个 一个是被防火墙拦截 或者该端口的监听地址为本机(127.0.0

命名空间“System.Web”中不存在类型或命名空间名称“Optimization”解决方法

在App_Code中添加BundleConfig.cs using System.Web.Optimization; public class BundleConfig{    public static void RegisterBundles(BundleCollection bundles)    {        bundles.Add(new StyleBundle("~/bundles/news.css")            .Include("~/commo