David Zhao
David Zhao

Reputation: 4514

How to copy cell content in dojo grid

I have a web page displaying data using dojo datagrid. Sometimes, users need to copy contents from certain cells for further analysis, but since browser's right click event is disabled in dataGrid, what's the best way to copy the contents to the clipboard? Thanks in advance!

David

Upvotes: 0

Views: 6169

Answers (2)

Dean Peterson
Dean Peterson

Reputation: 467

You do not need anything fancy. I had to do this myself and after looking at so many overly complex solutions I read the documentation and found the easiest way. The grid was meant to do this, it just requires the developer to add menus to an EnhancedGrid. One "gotcha" is that the grid constructor MUST include a div ID. It can not be inserted using dijit.placeAt().

Solution:

function someFunction(){
    var selRegionMenu = createSelectedRegionMenu(resultsGrid);
                    resultsGrid = new dojox.grid.EnhancedGrid({
                        id: "issueHistoryResultsGrid",
                        selectable: true,
                        plugins:{menus:{rowMenu:selRegionMenu, selectedRegionMenu:selRegionMenu}},
                        store: gridStore,
                        clientSort: true,
                        structure: gridLayout,
                        height: '450px'
                    }, "gridDiv");
}

function createSelectedRegionMenu(resultsGrid)
            {   
                var selRegionMenu = new dijit.Menu({id:"selectedRegionMenu"});
                selRegionMenu.addChild(new dijit.MenuItem({label:"Copy",  iconClass: "dijitEditorIcon dijitEditorIconCopy", onClick:copySelectedContent}));
                selRegionMenu.startup();
                return selRegionMenu;
            }



function copySelectedContent(){
        var historyGrid = dijit.byId("issueHistoryResultsGrid");
        //var selected = historyGrid.selected;
        //var didSucceed = window.clipboardData.setData("Text",selected);
        CopiedTxt = document.selection.createRange();

        CopiedTxt.execCommand("Copy");
    }

Upvotes: 0

seth
seth

Reputation: 37267

When you create your Grid, you can set selectable to true.

 <div dojotype="dojox.grid.DataGrid" selectable="true" ....>

Or programatically:

var grid = new dojox.grid.DataGrid( { selectable: true, ... });

Upvotes: 7

Related Questions