Zoso
Zoso

Reputation: 71

ui-grid : how to enable select and copy cell content (text) to clipboard?

I'm using ui-grid v3.0.6 and I want to enable the feature that allows the user to select cell content using the cursor and copy it to the clipboard. I see that the example in www.ui-grid.info supports this feature. If it is a gridOption that needs to be enabled, which one is it? By default I'm unable to perform this operation.

Upvotes: 4

Views: 1548

Answers (1)

miguelote
miguelote

Reputation: 51

This works for me

    $scope.gridOptions.onRegisterApi = function (gridApi) {
    //set gridApi on scope
    $scope.gridApi = gridApi;
    var cellValue = "";

    gridApi.cellNav.on.navigate($scope, function (newRowCol, oldRowCol) {
        var name = newRowCol.col.name;
        cellValue = newRowCol.row.entity[name];
        console.log('navigation event:' + cellValue);
        $('.grid').on('keydown', function (e) {
            var tag = e.target.tagName.toLowerCase();
            e = e || window.event;
            var key = e.which || e.keyCode; // keyCode detection
            var ctrl = e.ctrlKey ? e.ctrlKey : ((key === 17) ? true : false); // ctrl detection

            if (key == 86 && ctrl) {
                console.log("Ctrl + V Pressed !");
            } else if (key == 67 && ctrl) {
                var $temp = $("<input>");
                $("body").append($temp);
                $temp.val(cellValue).select();
                document.execCommand("copy");
                $temp.remove();
                console.log("Ctrl + C Pressed !");
            }
        })
    });
   };

Upvotes: 0

Related Questions