6 Answers, 1 is accepted
0
Hello ,
Could you please elaborate a bit more on the scenario you aim to achieve. Currently, if you are editing some cell and click on the icons of the toolbar, the cell will loose its focus, hence the edit mode will end.
Regards,
Nencho
Telerik by Progress
Could you please elaborate a bit more on the scenario you aim to achieve. Currently, if you are editing some cell and click on the icons of the toolbar, the cell will loose its focus, hence the edit mode will end.
Regards,
Nencho
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which
deliver the business app essential building blocks - a grid component,
data visualization (charts) and form elements.
0
Su Pei
Top achievements
Rank 1
Rank 1
answered on 23 Mar 2017, 03:34 AM
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Kendo UI Snippet</title>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.1028/styles/kendo.common.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.1028/styles/kendo.rtl.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.1028/styles/kendo.silver.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.1028/styles/kendo.mobile.all.min.css"/>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2016.3.1028/js/jszip.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2016.3.1028/js/kendo.all.min.js">
</script>
</head>
<body>
<style>
.k-state-disabled{
color:#13084a;
}
</style>
<div id="div_batchUpdate">
<div id="ssBatchUpdate" style="width: 100%;"></div>
<script>
$(function() {
$("#ssBatchUpdate").kendoSpreadsheet({
columns: 26,
rows: 30,
sheetsbar: false,
excel: {
// Required to enable Excel Export in some browsers
proxyURL: "//demos.telerik.com/kendo-ui/service/export"
},
formulabar:false,
toolbar: {
insert: false,
data:false,
home: [
{
type: "button",
text: "Save",
value:"Save",
spriteCssClass: "fa fa-floppy-o",
click: function() {
var transTrackerValue =spreadsheet.activeSheet().range("D2").values()[0];
window.alert("Value:"+transTrackerValue);
}
},
"exportAs","filter","copy","cut","paste"
]
},
sheets: [
{
rows: [
{
height: 25,
cells: [
{value: "PO"},
{value:"Request Date"},
{value:"Current Promise Date"},
{value:"Trans Tracker Number"},
],
},
{cells:[{value:"12345-1"},
{value:new Date("11-May-2016"),format: "dd-MMM-yyyy"},
{value:""}
]}
,
{cells:[{value:"23456-2"},
{value:new Date("22-Jun-2016"),format: "dd-MMM-yyyy"},
{value:""}
]}
],
columns: [
{width: 80},{width: 80},{width: 120},{width: 120},
]
}
]
});
var spreadsheet = $("#ssBatchUpdate").data("kendoSpreadsheet");
spreadsheet._view.tabstrip.tabGroup.find("li:eq(0) .k-link").text("PO Promise Date");
var formulaBar = spreadsheet.element.children()[1];
formulaBar.remove();
spreadsheet.resize();
var sheet = spreadsheet.activeSheet();
sheet.frozenColumns(1);
sheet.frozenRows(1);
var range = spreadsheet.activeSheet().range("1:1,A:B");
range.enable(false);
var colDate = spreadsheet.activeSheet().range("C2:C");
colDate.validation({
dataType: "date",
showButton: true,
allowNulls: true,
type: "reject",
comparerType: "between",
from: "DATEVALUE(\"1/1/2000\")",
to: "DATEVALUE(\"1/1/2099\")",
titleTemplate: "Date validaton error",
messageTemplate: "Invalid Date"
});
colDate.format("dd-MMM-yyyy");
});
</script>
</div>
</body>
</html>
<html>
<head>
<meta charset="utf-8"/>
<title>Kendo UI Snippet</title>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.1028/styles/kendo.common.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.1028/styles/kendo.rtl.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.1028/styles/kendo.silver.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.1028/styles/kendo.mobile.all.min.css"/>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2016.3.1028/js/jszip.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2016.3.1028/js/kendo.all.min.js">
</script>
</head>
<body>
<style>
.k-state-disabled{
color:#13084a;
}
</style>
<div id="div_batchUpdate">
<div id="ssBatchUpdate" style="width: 100%;"></div>
<script>
$(function() {
$("#ssBatchUpdate").kendoSpreadsheet({
columns: 26,
rows: 30,
sheetsbar: false,
excel: {
// Required to enable Excel Export in some browsers
proxyURL: "//demos.telerik.com/kendo-ui/service/export"
},
formulabar:false,
toolbar: {
insert: false,
data:false,
home: [
{
type: "button",
text: "Save",
value:"Save",
spriteCssClass: "fa fa-floppy-o",
click: function() {
var transTrackerValue =spreadsheet.activeSheet().range("D2").values()[0];
window.alert("Value:"+transTrackerValue);
}
},
"exportAs","filter","copy","cut","paste"
]
},
sheets: [
{
rows: [
{
height: 25,
cells: [
{value: "PO"},
{value:"Request Date"},
{value:"Current Promise Date"},
{value:"Trans Tracker Number"},
],
},
{cells:[{value:"12345-1"},
{value:new Date("11-May-2016"),format: "dd-MMM-yyyy"},
{value:""}
]}
,
{cells:[{value:"23456-2"},
{value:new Date("22-Jun-2016"),format: "dd-MMM-yyyy"},
{value:""}
]}
],
columns: [
{width: 80},{width: 80},{width: 120},{width: 120},
]
}
]
});
var spreadsheet = $("#ssBatchUpdate").data("kendoSpreadsheet");
spreadsheet._view.tabstrip.tabGroup.find("li:eq(0) .k-link").text("PO Promise Date");
var formulaBar = spreadsheet.element.children()[1];
formulaBar.remove();
spreadsheet.resize();
var sheet = spreadsheet.activeSheet();
sheet.frozenColumns(1);
sheet.frozenRows(1);
var range = spreadsheet.activeSheet().range("1:1,A:B");
range.enable(false);
var colDate = spreadsheet.activeSheet().range("C2:C");
colDate.validation({
dataType: "date",
showButton: true,
allowNulls: true,
type: "reject",
comparerType: "between",
from: "DATEVALUE(\"1/1/2000\")",
to: "DATEVALUE(\"1/1/2099\")",
titleTemplate: "Date validaton error",
messageTemplate: "Invalid Date"
});
colDate.format("dd-MMM-yyyy");
});
</script>
</div>
</body>
</html>
0
Su Pei
Top achievements
Rank 1
Rank 1
answered on 23 Mar 2017, 03:42 AM
Hi Nencho,
Please have a look on the above code..
Thanks.
Regards,
Su Pei
0
Su Pei
Top achievements
Rank 1
Rank 1
answered on 23 Mar 2017, 03:46 AM
Hi Nencho,
Please have a look on the above code.
Step :
1) enter "111" in column trans tracker number D2
2) Without click on other column, direct click on save button
3) Prompt "Value: "
4) Click on other column
5) Click save button, prompt "Value:111"
Regards,
Su Pei
0
Hello Su,
Thank you for the provided example and detailed explanation.
Indeed there was such an issue, in the version that you are using in the code snippet (2016.3.1028) with this . However, this issue is already fixed and you can test the , using our latest official release:
http://dojo.telerik.com/@nenchef/eBUBa/2
Regards,
Nencho
Telerik by Progress
Thank you for the provided example and detailed explanation.
Indeed there was such an issue, in the version that you are using in the code snippet (2016.3.1028) with this . However, this issue is already fixed and you can test the , using our latest official release:
http://dojo.telerik.com/@nenchef/eBUBa/2
Regards,
Nencho
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.
0
Su Pei
Top achievements
Rank 1
Rank 1
answered on 27 Mar 2017, 12:25 AM
Hi Nencho,
Ok. This has solved my problem.
Thanks!
Regards,
Su Pei