WijGrid HowTo : Paste ClipBoard Data Using Ctrl + V

One of our customers asked us how to paste copied records from Excel in Wijmo Grid using Ctrl + v key. In this blog, we'll discuss a very simple approach to do the same. The idea for this implementation is :

  1. Get Clipboard Data
  2. Break it down into a two dimensional array with rows and columns
  3. Push this array one by one into the grid data.

Since the pasting operation is usually done using Ctrl + v, we will handle the KeyDown event of the grid.

$("#demo").keydown(function (e)  
{  
    if (e.ctrlKey && (e.keyCode == 86)) {  
        // get the clipboard text  
        var clipText = window.clipboardData.getData('Text');  
        // split into rows  
        clipRows = clipText.split(String.fromCharCode(13));  
        // split rows into columns  
        for (i = 0; i < clipRows.length; i++) {  
            clipRows[ i ] = clipRows[ i ].split(String.fromCharCode(9));  
        }  

        var $grid = $('#demo');  
        data = $grid.wijgrid("data");  

        for (var i = 0; i < clipRows.length-1; i++) {  
            data.push(clipRows[ i ]);  
        }  

        $grid.wijgrid('ensureControl', true);  
        $('#demo').wijgrid('doRefresh');  

    }  
});

Download Sample for detailed implementation. Download Sample

GrapeCity

GrapeCity Developer Tools
comments powered by Disqus