Kendo Copy Data from Excel
Copy Data from Excel
HTML
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2016.2.607/styles/kendo.common.min.css">
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.silver.min.css">
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.607/styles/kendo.mobile.all.min.css">
<script src="//code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="//kendo.cdn.telerik.com/2016.2.607/js/jszip.min.js"></script>
<script src="//kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js"></script>
<div id="grid" tabindex="0"></div>
<button id="export">Export to Excel</button>
<textarea id="excelPasteArea"></textarea>
CSS
#excelPasteArea {
height: 1px;
width: 1px;
border: 0 none;
margin-left: -9999px;
}
JavaScript
$("#export").click(function(e) {
var grid = $("#grid").data("kendoGrid");
grid.saveAsExcel();
});
var excelPasteArea = $('#excelPasteArea');
function processPasteLine(count, line) {
console.log(line);
}
function updatePasteArea() {
var lines = excelPasteArea.val().split(/[\n\r]/g);
if(lines.length) { $.each(lines, processPasteLine); }
excelPasteArea.val('');
}
$(document).keydown(function(e) {
if((e.metaKey || e.ctrlKey)) {
if(e.which === 86) {
excelPasteArea.val('').focus();
setTimeout(updatePasteArea, 50);
}
}
});
$("#grid").kendoGrid({
toolbar: ["excel"],
excel: {
fileName: "EquipmentsList.xlsx",
proxyURL: "http://demos.telerik.com/kendo-ui/service/export",
},
selectable: "multiple",
columns: [
{
field: "IsEngOk", title: "Eng Ok", width: 70,
template: '<input type="checkbox" class="EngineeringOk" name="IsEngOk" #= IsEngOk ? \'checked="checked"\' : "" # #= true ? disabled="disabled" : "" #></input>',
filterable: false,
locked: true
},
{
field: "POSerialNum",
title: "PO #",
width: 120,
hidden: true
},
{
field: "ActivityCode",
title: "Act Code",
locked: true,
width: 120
},
{
field: "Rev",
title: "Rev",
width: 60,
locked: true
},
{
field: "SystemCode0Title",
title: "Sys_Id",
width: 120,
locked: true
},
{
field: "SystemCode1",
title: "Sys 1",
width: 100,
locked: true
},
{
...