上下左右按键

其实单元格导航(上下左右按键,需要启用表格的ShowSelectedCell属性)一直都存在,只不过之前的版本(v5.5.0)有一些小的BUG。

BUG1

比如锁定列存在时,上下左右键只能在锁定表格或者主表格导航,可以看示例:https://pro.fineui.com/#/grid/grid_lockcolumn_editor_cell_new.aspx

新版本(v5.6.0)会修正这个问题,使用左右键导航时,会从锁定表格自然跨到主表格,不会局限于某个表格内:

同时还有一个和之前版本不一致的地方,新版本(v5.6.0)中左右键导航时,如果在最右侧单元格按下右键,是没有反应的(老版本会调到下一行)。

同样,新版本(v5.6.0)中上下键导航时,如果在最下方单元格按下向下按键,也是没反应(不会调到下一列),这样就比较统一。

BUG2

另一个BUG存在于树表格,由于部分节点隐藏,所以上下左右按键时会选中隐藏的行,这样界面上就没有任何选中的效果了,测试示例:

https://pro.fineui.com/#/gridtree/gridtree_celleditor.aspx

新版本(v5.6.0)实现这个效果会更复杂,因为我们在新版本重构了树表格的DOM结构,从单层 TR 改为 TR-TD-TABLE 的嵌套结构,所以少不了各种递归,不过我们还是实现了这个效果:

其实最复杂的实现莫过于 锁定列和树表格 同时存在的情况,我们特意写了个示例测试这种情况:

https://pro.fineui.com/#/gridtree/gridtree_celleditor_lockcolumn.aspx

看起来很简单哈,其实内部的逻辑有点复杂,涉及左右两个表格,每个表格里面又有2-3层的表格嵌套。

我们对此进行了深入思考,并公开了 4 个客户端函数,方便网友自行扩展,它们是:getNextRowEl, getPrevRowEl, getNextCellEl, getPrevCellEl

TAB键和ENTER键

既然上下左右键用来在单元格之间导航,那么TAB键和ENTER键又用来做什么呢?很多网友可能会被搞晕掉,其实很简单:

1. 上下左右键用于在单元格之间导航,需要启用ShowSelectedCell或者启用单元格编辑(非编辑状态)

2. TAB键和ENTER键仅用于单元格编辑,用来在单元格编辑之间快速切换

看下这个示例的TAB键导航情况:

https://pro.fineui.com/#/gridtree/gridtree_celleditor_lockcolumn.aspx

很多网友不知道,如果你按下 Shift+Tab 键,就会反方向切换单元格,看下效果:

同时,我们还支持上下方向导航,只需要启用 TabVerticalNavigate="true" 属性即可,此时的TAB导航效果:

除了TAB键,还可以让 ENTER 键实现单元格编辑的快速导航,这些规则都记录在在线示例中,可以自行查询:

匠心品质,你值得拥有!

加入知识星球下载FineUIPro/Mvc/Core的基础版

不忘初心,砥砺前行!

【新特性速递】单元格导航(上下左右键,TAB键和ENTER键)的更多相关文章

  1. ActiveReports 11 新特性速递

    又到了一年一度,翘首期盼的ActiveReports11 即将发布,ActiveReports 10 表控件横空出世,成为中国式复杂报表的救星后,ActiveReports11 又会有哪些令人惊奇的新 ...

  2. FineUIMvc新特性速递(大间距模式,隐藏菜单垂直滚动条)

    即将发布的 FineUIMvc 新版本会引入两个重要的特性,用来提升用户体验,现在就来先睹为快吧: 大间距模式 我们已经支持的显示模式有:紧凑模式,普通模式,大字体模式. 紧凑模式: 普通模式: 大字 ...

  3. 【新特性速递】FineUIPro/Mvc/Core 全新移动端访问体验(示例首页)!

    移动端支持 虽然 FineUIPro 早在 2016 年就已经完成对移动端的适配工作,并新增了 50 多个官网示例. 并且,我们也新增了一个移动端的首页 http://pro.fineui.com/m ...

  4. 【新特性速递】树控件结构由单层 TR 改为 TR-TD-TABLE 层级嵌套

    FineUIPro/Mvc/Core的下个版本(v6.1.0),我们对树控件进行了优化,由原来的单层 TR 改为 TR-TD-TABLE 层级嵌套,从而做到表里如一. 上个版本(v6.0.0),我们对 ...

  5. 【新特性速递】CSS3动画增强

    FineUIPro/Mvc/Core的下个版本(v6.1.0),我们对多个地方的CSS3动画进行了增强,使得用户体验更好. 1. 树控件启用EnableSingleExpand时,使得展开动画和折叠其 ...

  6. 【新特性速递】优化Shift/Ctrl行多选逻辑,和Windows的文件资源管理器保持一致!

    别告诉我你不知道 别告诉我你不知道可以使用键盘的 Shift 和 Ctrl 来多选表格行,因为这个在 Windows 文件资源管理器中的常用操作,此时的画风是这样的: 这个动图中进行了如下操作: 1. ...

  7. 【新特性速递】树表格结构由单层 TR 改为 TR-TD-TABLE 层级嵌套!

    由于历史原因,在之前实现树表格时,我们有点偷懒,本来应该是层级嵌套的树结构,被我们硬生生的拉平了,请看: 可以看到,basic目录的子节点和basic是在同一级别的,因为此目录尚未展开,所以这些子节点 ...

  8. 【新特性速递】F.doPostBack的说明文档

    FineUIPro/Mvc/Core的下个版本(v6.1.0),我们对客户端JS函数 F.doPostBack 进行了增强,并增加说明文档. 如果你还没有查阅过FineUI的客户端文档,可以收藏下这个 ...

  9. golang1.16新特性速览

    今天是假期最后一天,明天起大家也要陆续复工了.golang1.16也在今天正式发布了. 原定计划是2月1号年前发布的,不过迟到也是golang的老传统了,正好也趁着最后的假期快速预览一下golang1 ...

随机推荐

  1. css兄弟选择器,+ ~选择器的区别

     壹 ❀ 引 实习生在写搜索框下拉提示时,遇到了不知道怎么解决的问题,所以来问我.效果不难,鼠标选中输入框(focus)时,展示搜索关键字相关提示,看了眼dom结构是这样的: 在她的理解里面,选中父元 ...

  2. 跳出"低水平勤奋陷阱"

    "低水平勤奋陷阱":摘记更多的知识 读书是获得知识的最基本,最重要的方式,但读书需要方法 所谓"低水平勤奋陷阱",就是花费了大量的时间和精力,但得到的结果却微乎 ...

  3. 洛谷 P4999(数位DP)

    ###洛谷 P4999 题目链接 ### 题目大意:给你一个区间,求这段区间中所有数的,数位上的,数字之和. 分析: 这题与 洛谷 P2602 相似,稍微改一下就可以了. 求出 0 ~ 9 的个数,然 ...

  4. 依赖注入在 dotnet core 中实现与使用:3 使用 Lazy<T> 延迟实例化

    有些对象我们并不想一开始就实例化,由于性能或者功能的考虑,希望等到使用的时候再实例化.考虑存在一个类 A, 它使用了依赖的类 B,在 A 中,只有某些不常用到的方法会涉及调用 B 中的方法,多数情况下 ...

  5. C++ 类的前向声明的用法

    我们知道C++的类应当是先定义,然后使用.但在处理相对复杂的问题.考虑类的组合时,很可能遇到俩个类相互引用的情况,这种情况称为循环依赖. 例如: class A { public: void f(B ...

  6. windows7_删除”右键-新建“菜单中的多余项

    这边文章比较好用:分享下 https://blog.csdn.net/ddgweb/article/details/17993251 在使用windows7的过程中,由于安装了较多的软件,在桌面或者资 ...

  7. Z从壹开始前后端分离【 .NETCore2.1 +Vue 2 +AOP+DI】框架之一 || 前言

    老张 .NetCore与Vue 框架学习目录

  8. Spring Boot 中如何配置 Profile

    本人免费整理了Java高级资料,涵盖了Java.Redis.MongoDB.MySQL.Zookeeper.Spring Cloud.Dubbo高并发分布式等教程,一共30G,需要自己领取.传送门:h ...

  9. Add a Class from the Business Class Library 从业务类库添加类 (XPO)

    In this lesson, you will learn how to use business classes from the Business Class Library as is. Fo ...

  10. JS基础语法---分支语句总结

    分支语句: if语句:一个分支 if-else语句:两个分支,最终只执行一个分支 if-else if-else if...语句: 多个分支,也是只会执行一个 switch-case语句:多分支语句, ...