草庐IT

javascript - Kendo Grid 如何以编程方式聚焦网格单元格并阻止选择文本

coder 2023-08-07 原文

我有一个剑道网格，编辑模式设置为 incell。

以编程方式聚焦特定单元格以强制其进入编辑模式的最优雅方法是什么？

假设我有一个网格，其中第 1 列和第 6 列是可编辑的。一旦用户在第 1 列中完成输入内容，我希望第 6 列文本框自动聚焦并启用编辑，这样用户就不必手动单击同一行的下一个可编辑网格单元。

这就是我现在正在做的事情:

//Focuses the editable cell at given row/column index.
//Closes the previously editing cell
//EX: setGridFocus(SALE_01_DIV_GRID,0,0) --> Focuses SALE_01_DIV_GRID (0,0)
function setGridFocus(gridID, rowIndex, colIndex)
{
    var grid = $('#' + gridID).data('kendoGrid');
    grid.closeCell();

    setTimeout(function(){
        var cell = $('#' + gridID).find('tbody tr:eq('+rowIndex+') td:eq('+colIndex+')');
        grid.editCell(cell);
        var editTextCell = cell.find("input.k-formatted-value");

        editTextCell.focus(function() {
            $(this).select().mouseup(function (e) {
                e.preventDefault();
                $(this).unbind("mouseup");
                e.select();
            });
        });
        cell.find("input[type=text]").select();
        editTextCell.selectall();
    },50); 
}

首先，我使用 setTimeout 来实现看似微不足道的功能，因此这似乎不是理想的方法。

其次，上面的函数只在感觉合适的时候才起作用(从测试来看，只有一半的时间起作用。可能是 setTimeout 函数预期的)。我觉得这与 Kendo Grid 内部调用的事件顺序有关。

第三，我想阻止选择被聚焦的单元格内的文本。 editTextCell.selectall();不适用于此目的。

如有任何指导，我将不胜感激。

最佳答案

这是实现您想要的目标的可靠方法。它仍然使用 setTimeout，因此它可以可靠地聚焦不同的剑道输入 (Docs source for focusing kendo inputs):

function setGridFocus(gridID, rowIndex, colIndex) {
  var grid = $('#' + gridID).data('kendoGrid');
  grid.closeCell();

  var cell = $('#' + gridID).find('tbody tr:eq(' + rowIndex + ') td:eq(' + colIndex + ')');
  grid.editCell(cell);
  var editTextCell = cell.find('input');

  var selectTimeId;

  editTextCell
    .on('focus', function() {
      var input = $(this);
      clearTimeout(selectTimeId); // stop started time out if any

      selectTimeId = setTimeout(function() {
        input.select();
        // To make this work on iOS, too, replace the above line with the following one. Discussed in https://stackoverflow.com/q/3272089
        // input[0].setSelectionRange(0, 9999);
      });
    })
    .blur(function(e) {
      clearTimeout(selectTimeId); // stop started timeout
    });


  editTextCell.focus();
}

关于javascript - Kendo Grid 如何以编程方式聚焦网格单元格并阻止选择文本，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17015882/

何以javascript39editTextCellfunctionjqueryhtmlkendo-uikendo-grid

有关javascript - Kendo Grid 如何以编程方式聚焦网格单元格并阻止选择文本的更多相关文章

  1. ruby - 如何以所有可能的方式将字符串拆分为长度最多为 3 的连续子字符串？ - 2

    我试图获取一个长度在1到10之间的字符串，并输出将字符串分解为大小为1、2或3的连续子字符串的所有可能方式。例如:输入:123456将整数分割成单个字符，然后继续查找组合。该代码将返回以下所有数组。[1,2,3,4,5,6][12,3,4,5,6][1,23,4,5,6][1,2,34,5,6][1,2,3,45,6][1,2,3,4,56][12,34,5,6][12,3,45,6][12,3,4,56][1,23,45,6][1,2,34,56][1,23,4,56][12,34,56][123,4,5,6][1,234,5,6][1,2,345,6][1,2,3,456][123

  2. ruby - 寻找通过阅读代码确定编程语言的ruby gem？ - 2

    几个月前，我读了一篇关于ruby​​gem的博客文章，它可以通过阅读代码本身来确定编程语言。对于我的生活，我不记得博客或gem的名称。谷歌搜索“ruby编程语言猜测”及其变体也无济于事。有人碰巧知道相关gem的名称吗？ 最佳答案 是这个吗:http://github.com/chrislo/sourceclassifier/tree/master 关于ruby-寻找通过阅读代码确定编程语言的rubygem？，我们在StackOverflow上找到一个类似的问题：

  3. ruby-on-rails - Prawn - 表格单元格内的链接 - 2

    我正在尝试用Prawn生成PDF。在我的PDF模板中，我有带单元格的表格。在其中一个单元格中，我有一个电子邮件地址:cell_email=pdf.make_cell(:content=>booking.user_email,:border_width=>0)我想让电子邮件链接到“mailto”链接。我知道我可以这样链接:pdf.formatted_text([{:text=>booking.user_email,:link=>"mailto:#{booking.user_email}"}])但是将这两行组合起来(将格式化文本作为内容)不起作用:cell_email=pdf.make_c

  4. 网络编程套接字 - 2

    网络编程套接字网络编程基础知识理解源`IP`地址和目的`IP`地址理解源MAC地址和目的MAC地址认识端口号理解端口号和进程ID理解源端口号和目的端口号认识`TCP`协议认识`UDP`协议网络字节序socket编程接口`sockaddr``UDP`网络程序服务器端代码逻辑：需要用到的接口服务器端代码`udp`客户端代码逻辑`udp`客户端代码`TCP`网络程序服务器代码逻辑多个版本服务器单进程版本多进程版本多线程版本线程池版本服务器端代码客户端代码逻辑客户端代码TCP协议通讯流程TCP协议的客户端/服务器程序流程三次握手（建立连接）数据传输四次挥手（断开连接）TCP和UDP对比网络编程基础知识

  5. ruby-on-rails - 在 RSpec 中，如何以任意顺序期望具有不同参数的多条消息？ - 2

    RSpec似乎按顺序匹配方法接收的消息。我不确定如何使以下代码工作:allow(a).toreceive(:f)expect(a).toreceive(:f).with(2)a.f(1)a.f(2)a.f(3)我问的原因是a.f的一些调用是由我的代码的上层控制的，所以我不能对这些方法调用添加期望。 最佳答案 RSpecspy是测试这种情况的一种方式。要监视一个方法，用allowstub，除了方法名称之外没有任何约束，调用该方法，然后expect确切的方法调用。例如:allow(a).toreceive(:f)a.f(2)a.f(1)

  6. ruby - 单元测试文件 I/O 方法 - 2

    我对单元测试还是比较陌生。我用Ruby编写了一个类，它接受一个文件，在该文件中搜索给定的Regex模式，替换它，然后将更改保存回文件。我希望能够为此方法编写单元测试，但我不知道我将如何去做。有人能告诉我我们如何对处理文件i/o的方法进行单元测试吗？ 最佳答案 看看这个HowdoIunit-testsavingfiletothedisk?基本上这个想法是一样的，文件系统是你的类的依赖。所以引入一个可以在你的单元测试中模拟的角色/接口(interface)(这样你在单元测试时就没有依赖性)；角色中的方法应该是您从文件系统中需要的所有东西

  7. ruby - 我正在学习编程并选择了 Ruby。我应该升级到 Ruby 1.9 吗？ - 2

    我完全不是程序员，正在学习使用Ruby和Rails框架进行编程。我目前正在使用Ruby1.8.7和Rails3.0.3，但我想知道我是否应该升级到Ruby1.9，因为我真的没有任何升级的“遗留”成本。缺点是什么？我是否会遇到与普通gem的兼容性问题，或者甚至其他我不太了解甚至无法预料的问题？ 最佳答案 你应该升级。不要坚持从1.8.7开始。如果您发现不支持1.9.2的gem，请避免使用它们(因为它们很可能不被维护)。如果您对gem是否兼容1.9.2有任何疑问，您可以在以下位置查看:http://www.railsplugins.or

  8. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  9. ruby - 如何以编程方式删除实例上的 "singleton information"以使其编码(marshal)？ - 2

    我创建了一个由于“在运行时执行的单例元类定义”而无法编码的对象(这段代码的描述是否正确？)。这是通过以下代码执行的:#defineclassXthatmyusesingletonclassmetaprogrammingfeatures#throughcallofmethod:break_marshalling!classXdefbreak_marshalling!meta_class=class我该怎么做才能使对象编码正确？是否可以从对象instance_of_x的classX中“移除”单例组件？我真的需要一个建议，因为我们的一些对象需要通过Marshal.dump序列化机制进行缓存。

  10. Ruby 元编程问题 - 2

    我正在查看Ruby日志记录库Logging.logger方法并从sourceatgithub提出问题与这段代码有关:logger=::Logging::Logger.new(name)logger.add_appendersappenderlogger.additive=falseclass我知道类 最佳答案 这实际上删除了方法(当它实际被执行时)。这是确保close不会被调用两次的保障措施。看起来好像有嵌套的“class 关于Ruby元编程问题，我们在StackOverflow上找到一

随机推荐