Question

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

Answer 1

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");
    }