码迷,mamicode.com
首页 > Web开发 > 详细

HTML5 Wijmo:控制 Wijmo Grid 插件的编辑模式

时间:2014-05-01 11:59:06      阅读:820      评论:0      收藏:0      [点我收藏+]

标签:des   style   blog   class   java   tar   javascript   strong   color   get   art   

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 来禁止用户编辑特定列.

最终效果图:

mamicode.com,码迷

 

Demo 下载:

 

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

HTML5 Wijmo:控制 Wijmo Grid 插件的编辑模式,码迷,mamicode.com

HTML5 Wijmo:控制 Wijmo Grid 插件的编辑模式

标签:des   style   blog   class   java   tar   javascript   strong   color   get   art   

原文地址:http://www.cnblogs.com/C1SupportTeam/p/editing-modes-in-wijmo-grid-2.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!