Wijmo jQuery 插件经常应用于在财务类网站中创建平滑和良好用户体验的交互表格。WijGrid 插件用于显示、排序、分组和编辑数据。今天我们来分享下如何控件WijGrid插件的编辑模式。

在本篇博客汇总我们将会实现通过以下方式来是 WijGrid 进入编辑状态:

  • 单击
  • 双击
  • 特定列

我们可以通过设置 allowEditing 属性允许 WijGrid 编辑。默认情况下 WijGrid 通过点击“F2”或双击进入编辑状态。

通过单击使单元格进入编辑状态,我们需要捕获 currentCellChanged 事件,并且通过代码来使单元格进入编辑状态。代码如下:

   currentCellChanged: function (e, args) {
            if ($(e.target).wijgrid('option', 'isLoaded')) {
                selectedEditMode = $("#editMode").wijcombobox("option", "selectedValue");
                //if Editing mode is single click then start editing
                if (selectedEditMode == 'Single Click') {
                   window.setTimeout(function () {
                   $(e.target).wijgrid('beginEdit');
                   }, 100);
             }
         }
     }

可以通过设置列的 readOnly 属性为 true 来禁止用户编辑特定列.

最终效果图:

Demo 下载:

更多关于 HTML5 Wijmo 特性请参考:http://wijmo.gcpowertools.com.cn/

HTML5 Wijmo:控制 Wijmo Grid 插件的编辑模式的更多相关文章

  1. iOS UIKit:TableView之编辑模式(3)

    一般table view有编辑模式和正常模式,当table view进入编辑模式时,会在row的左边显示编辑和重排控件,如图 42所示的编辑模式时的控件布局:左边的editing control有表 ...

  2. HTML5 canvas生成图片马赛克特效插件

    HTML5 canvas生成图片马赛克特效插件 简要教程 这是一款使用html5 canvas来将图片制作成马赛克效果的js插件.该插件的灵感来自于美国肖像画家Chuck Close.已经有人使用这个 ...

  3. [Ext JS 4] 实战之Grid, Tree Gird编辑Cell

    前言 本篇这里以稍微复杂一点的Tree Grid 来介绍. 在写编辑grid 之, 先来看一下 grid 的 selType 的配置. 先给一个简单的Tree grid 的例子: Ext.onRead ...

  4. EXTJS4.0 grid 可编辑模式 配置

    首先配置这个参数 plugins:[//插件 Ext.create("Ext.grid.plugin.CellEditing",{ clicksToEdit:1//单元格 点一下就 ...

  5. ExtJs Grid 删除,编辑,查看详细等超链接处理

    在网上查了好多资料,关于ExtJs处理操作栏的“删除”.“编辑”.“查看详细”的处理,原来项目都是这么处理: 操作栏:{ text:'操作', xtype:'actioncolumn', items ...

  6. 在 Sublime Text 2 中使用 SFTP 插件快速编辑远程服务器文件

    在 Sublime Text 2 中使用 SFTP 插件快速编辑远程服务器文件 开源程序 浏览:29555 2013年05月02日 文章目录[隐藏] 常见的工作流程 SFTP 安装和使用方法 第一步: ...

  7. easyui datagrid 编辑模式详解

       一,建立编辑器 从api得知,扩展一种新的编辑器类型,需要提供以上几个方法.项目中正好需要一个checkbox 类型编辑器,但在easyui中并没提供这样的编辑器,那我们可以通过扩展编辑器来解决 ...

  8. .NET简谈插件系统开发模式

    摘选自[王清培]博客 http://www.cnblogs.com/wangiqngpei557/archive/2011/06/10/2077413.html 今天跟大家分享一下我们在日常开发中并不 ...

  9. 实现Launcher编辑模式(1) 壁纸更换

    Android Launcher分析和修改13——实现Launcher编辑模式(1) 壁纸更换 Posted on 2013-09-11 23:25 泡泡糖 阅读(212) 评论(3) 编辑 收藏 已 ...

随机推荐

  1. Android获取TextView显示的字符串宽度

    工作上有业务需要判断textview是否换行,我的做法是判断textview要显示的字符串的宽度是否超过我设定的宽度,若超过则会执行换行. 项目中的其他地方也有这样的需求,故直接使用了那一块的代码.如 ...

  2. AngularJs解决方案笔记(1)

    接触AngularJs约1年半时间,目前用其独立完成了一个Solution, 构建出比较完整的项目架构,从C/S往B/S转型的过程背后是大量精力与时间成本的付出,特别是工作了好几年后, 本来掌握好的稳 ...

  3. 常用的Expression调用形式

    ConstantExpression exp1 = Expression.Constant();构建常量表达式(还可以加类型) BinaryExpression exp12 = Expression. ...

  4. web app变革之rem(手机屏幕实现全适配)

    以往web移动适配,常规写法是:media only screen @media only screen and (min-device-width: 320px){ //针对iPhone 3 } @ ...

  5. 记录一个__lll_lock_wait_private错误

    一个DBA同事昨天在执行一个命令行工具的时候发现程序hang住,问题挺有意思,值得记录下. 首先用pstack看了下程序的调用栈,这是个多线程程序,pstack结果看到几乎所有的线程都等在write调 ...

  6. 增大VM下linux的根目录空间

    增大VM下linux的根目录空间   用的太久,发现VM下的系统空间不足.简单的方法是,分一个新硬盘,挂载到根目录下.    下面是直接增大根目录下空间:  1. 增大vm下的磁盘大小, VM -&g ...

  7. “远程调试监视器(MSVSMON.EXE)似乎没有在远程计算机上运行“的完美解决方案

    今天调试程序时,Visual Studio突然报出了如下错误: Microsoft Visual Studio 远程调试监视器(MSVSMON.EXE)似乎没有在远程计算机上运行.这可能是因为防火墙阻 ...

  8. Til the Cows Come Home(最短路)

    Til the Cows Come Home Time Limit:1000MS     Memory Limit:65536KB     64bit IO Format:%I64d & %I ...

  9. oracle 11g 如何创建、修改、删除list-list组合分区

    Oracle11g在分区方面做了很大的提高,不但新增了4种复合分区类型,还增加了虚拟列分区.系统分区.INTERVAL分区等功能. 9i开始,Oracle就包括了2种复合分区,RANGE-HASH和R ...

  10. ruby中Hash排序

    当values都是整形时,按照Hash的Values排序: h = {'a'=>1,'b'=>2,'c'=>5,'d'=>4} h.sort {|a,b| a[1]<=& ...