Jquery 如何在剑道网格中获取复制单元格的原始值

在剑道网格中复制单元格时，如何获取基础值

我有以下代码

$(document).ready(function () {

                    $("#cellSelection").kendoGrid({
                        dataSource: {
                            data: orders,
                            pageSize: 6
                        },
                        selectable: "multiple cell",
                        allowCopy: true,
                        pageable: {
                            buttonCount: 5
                        },
                        scrollable: false,
                        navigatable: true,
                        columns: [
                            {
                                field: "ShipCountry",
                                title: "Ship Country",
                                width: 300
                            },
                            {
                                field: "Freight",
                                width: 300
                            },
                            {
                                field: "OrderDate",
                                title: "Order Date",
                                format: "{0:dd/MM/yyyy}"
                            }
                        ]
                    });

                    //events to capture when Ctrl + C is pressed
                    $("#cellSelection").bind('copy', function (e) {
                        var grid = $("#cellSelection").data("kendoGrid");
                        if (grid != null && grid.areaClipBoard != undefined) {
                            console.log("copied content is:");
                            console.log(grid.areaClipBoard.val());
                        }
                    });
                });

因此，复制单元格时，单元格中可见的值将被复制

比方说，如果您从网格复制的值是

40.65

，那么在剑道网格中将

allowCopy

设置为true时，仅复制该值。但根据数据源，原始值为

40.6789

。我需要在按下ctrl+c时将原始值复制到剪贴板

正如您所见，我编写了复制事件，它只输出从网格复制的内容。当按下ctrl+c时，有没有一种方法可以获取基础值

---

这里是链接。运行fiddle和opendeveloper工具，选择几个单元格并复制它。如果需要用

40.6789

而不是

40.68

我在下面的示例中执行格式化。。。可能对你有帮助

---

要获取所选行的数据，请使用：

grid.dataItem(grid.select());

在本例中，您使用的是单元格选择，而

grid.dataItem

返回

null

这迫使你进入风景优美的路线。要获取该值，您需要：

从选定单元格中查找选定行

获取该行的数据

确定所选列

使用列获取字段名

从行数据和字段名中，您最终可以找到原始值

因此，要把这些放在一起：

$("#cellSelection").bind('copy', function(e) {
  var grid = $("#cellSelection").data("kendoGrid");
  if (!grid) {
    return;
  }
  if (grid.areaClipBoard) {
    console.log("copied content is:", grid.areaClipBoard.val());
  }
  var cell = grid.select()[0];
  var row = cell.parentNode;
  var column = grid.columns[cell.cellIndex];
  var data = grid.dataItem(row);
  var cellData = data[column.field];
  console.log(cellData);    
});

关于这一点，有几点需要注意：

我认为我的错误处理还没有准备好

我只对第一个选定的单元格执行此操作。实际上，您使用的是多个单元格，因此您可能应该迭代网格的结果。选择每个单元格，通过制表符或其他方式连接。我不知道。你是那个想要多个细胞和复制的人

如果你可以想象隐藏专栏，那么我认为我获取专栏的方法行不通。我真的不知道你该怎么办

---

感谢@Cobus Kruger为您提供的解决方案。这是我的完整解决方案

我们必须循环网格中的选定项，获取底层数据源值并返回结果

请注意，我并不是自己编写上述函数的。我已经查看了kendo.all.js文件，并对其进行了调试，并为自己的目的进行了定制

在您获得复制的文本后，我们必须在复制事件中调用它

---

就这些！现在，您可以根据需要粘贴到任何excel工作表。它将与您在网格中选择的内容具有完全相同的空间。

值必须以2精度显示，但复制时应保留原始值如果我必须循环选择的项目并将值与数据源映射，然后，我必须以某种特定的格式将其再次推送到剪贴板，以便它能够按照网格中的选择粘贴到excel工作表是的，听起来差不多。您没有在问题中指定要对多个单元格执行什么操作，因此我不得不猜测：）kendo中copy的默认实现确实提供了确切的功能，但它只是复制网格上显示的任何内容。我感兴趣的是，我们是否可以调整copy的默认实现，并推送原始值，而不是网格上显示的值。我在这里展示的是如何返回用于填充网格的数据。它不应该受到格式、截断和网格中可能发生的其他事情的影响。你是在问这个问题，还是想改变拷贝的功能？+1感谢你的解决方案@Cobus。我已经修改了我的解决方案以满足我的需要。我马上就贴出来

function getTSVFormat(grid) {
    var selected = grid.select();
    var delimeter = '\t';
    var allowCopy = grid.options.allowCopy;
    var onlyVisible = true;
    if ($.isPlainObject(allowCopy) && allowCopy.delimeter) {
        delimeter = allowCopy.delimeter;
    }
    var text = '';
    if (selected.length) {
        if (selected.eq(0).is('tr')) {
            selected = selected.find('td:not(.k-group-cell)');
        }
        if (onlyVisible) {
            selected.filter(':visible');
        }
        var result = [];
        var cellsOffset = grid.columns.length;
        var lockedCols = grid._isLocked() && lockedColumns(grid.columns).length;
        var inLockedArea = true;
        $.each(selected, function (idx, cell) {
            cell = $(cell);
            var tr = cell.closest('tr');
            var rowIndex = tr.index();
            var cellIndex = cell.index();
            if (onlyVisible) {
                cellIndex -= cell.prevAll(':hidden').length;
            }
            if (lockedCols && inLockedArea) {
                inLockedArea = $.contains(grid.lockedTable[0], cell[0]);
            }
            if (grid._groups() && inLockedArea) {
                cellIndex -= grid._groups();
            }
            cellIndex = inLockedArea ? cellIndex : cellIndex + lockedCols;
            if (cellsOffset > cellIndex) {
                cellsOffset = cellIndex;
            }
            var cellText = cell.text();

            var column = grid.columns[cellIndex];
            var data = grid.dataItem(tr);
            var cellData = data[column.field];

            if (!result[rowIndex]) {
                result[rowIndex] = [];
            }
            result[rowIndex][cellIndex] = cellData;

        });
        var rowsOffset = result.length;
        result = $.each(result, function (idx, val) {
            if (val) {
                result[idx] = val.slice(cellsOffset);
                if (rowsOffset > idx) {
                    rowsOffset = idx;
                }
            }
        });
        $.each(result.slice(rowsOffset), function (idx, val) {
            if (val) {
                text += val.join(delimeter) + '\r\n';
            } else {
                text += '\r\n';
            }
        });
    }
    return text;
}

$("#cellSelection").bind('copy', function (e) {
                    var grid = $("#cellSelection").data("kendoGrid");
                    var text = getTSVFormat(grid);

                    //add textarea if its not in yet
                    if (!grid.areaClipBoard) {
                        grid.areaClipBoard = $('<textarea />').css({
                            position: 'fixed',
                            top: '50%',
                            left: '50%',
                            opacity: 0,
                            width: 0,
                            height: 0
                        }).appendTo(grid.wrapper);
                    }

                    //overwrite the default clipboard content of kendo with our custom data source
                    grid.areaClipBoard.val(text);
                    //call copy to clipboard to copy the contents
                    copyToClipboard(text);
                });

function copyToClipboard(html) {
                var textarea = document.createElement('textarea');
                $(textarea).addClass('k-spreadsheet-clipboard').val(html).appendTo(document.body).focus().select();
                document.execCommand('copy');
                $(textarea).remove();
            }