We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Copy from Excel

Thread ID:

Created:

Updated:

Platform:

Replies:

127455 Nov 16,2016 02:29 PM UTC Nov 17,2016 12:24 PM UTC JavaScript 1
loading
Tags: ejGrid
Ignacio
Asked On November 16, 2016 02:29 PM UTC

Hi,
Is it possible to copy cells from MS Excel and paste them in ejGrid? or maybe i have to use other type of javascript grid?

Thanks!

Karthick Kuppusamy [Syncfusion]
Replied On November 17, 2016 12:24 PM UTC

Hi Ignacio, 

Thanks for Contacting Syncfusion support. 

We have analyzed your requirement and we have created a sample based on your requirement.In that sample we have converted the excel data to the Json data and we binded that data to the grid. 

Please find the code example. 

 
<script type="text/javascript"> 
        var data = [{ ID: 10248,Name: "Nancy", Address: "132,Capitalway,USA",MobileNumber:9898934539 }, 
                       { ID: 10249, Name:"andrew",Address: "4746,Seattle,USA",MobileNumber:9898432464 }, 
           ]; 
 
        $(function () { 
            $("#Grid").ejGrid({ 
                dataSource: data, 
                allowPaging: true, 
                columns: [ 
                         { field: "ID", headerText: "ID", textAlign: ej.TextAlign.Right, width: 65 }, 
                         { field: "Name", headerText: "Name", width: 90 }, 
                         { field: "Address", headerText: "Address", width: 90 }, 
                         { field: "MobileNumber", headerText: "Mobile Number", width: 90, textAlign: ej.TextAlign.Right }, 
                         ] 
            }); 



Converting Pasted Data to JSON 
The HTML markup and jQuery scripts play a vital role in getting clipboard Excel information and converting it to JSON. Also, for this purpose, We have written the jquery.pastable.js file in the jQuery plug-in style. 
 
Note: The jquery.pastable.js file is attached with the sample at the end of this post. 
The final script and HTML mark up are as follows.  
 
HTML 
<b>Paste your Excel data here:</b> <br> 
                <div id="pastable" contenteditable="true" style="width: 0; height: 40px; padding-left: 250px; overflow: hidden; border: solid 1px; text-indent: 100px; font-size: 0;"> </div> 
  
JQUERY 
$("#pastable").pastable({ 
                OnPasteComplete: function (data) { 
                    var jsonData = []; 
                    // Ensuring the pasted information is Excel data or HTML table data. 
                    if (data instanceof Object) { 
                        for (i = 0; i < data.length; i++) { 
                            jsonData.push(data[i]); 
                        } 
                      
                    } 
                    var gridData = JSON.stringify(jsonData); 
                    var gridObj = $("#Grid").data("ejGrid"); 
                    gridObj.dataSource(ej.parseJSON(gridData));//binding the excel data to the grid  
                } 
 
Please find the Snapshots for your reference. 

Excel data. 

 

Before Pasting. 

 

After pasting. 
 

Note:Grid column and the pasted excel data columns are must same order. 

Please refer the following UG Link for your reference. 



Regards, 
K.Karthick. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;