Hello there,
is it possible to translate the functions of the spreadsheet? E.g. =SUM( ), =SUMPRODUCT( ), etc...
Thank you!
Hi!
I want to show and hide the editor based on the dropdown selection or selected option in a select box using the jQuery and PHP.
Also when I select the "text/plain" from dropdown list I want to hide the editor and show the textarea and for "text/plain" I want to show the editor and hide the textarea.
$editor
=
new
\Kendo\UI\Editor(
'content'
);
$editor
->resizable(true);
$deserialization
=
new
\Kendo\UI\EditorDeserialization();
$custom
=
new
\Kendo\JavaScriptFunction($(
function
() { $(\
"#content\").data(\"kendoEditor\"
).wrapper.hide(); }););
$deserialization
->custom(
$custom
);
$editor
->deserialization(
$deserialization
);
if
(
$mimeTag
==
'text/html'
) {
print_r('show editor');
}
elseif
(
$mimeTag
==
'text/plain'
) {
print_r('show textarea');
}
else
{
//hide the textarea or editor
$editor
->deserialization(
$deserialization
);
print_r('hide');
}
$dropDownList
=
new
\Kendo\UI\DropDownList(
'dropdownlist'
);
$dropDownList
->dataTextField(
'mimeTag'
)
->dataValueField(
'value'
)
->dataSource(
array
(
array
(
'text'
=>
'text/html'
,
'value'
=>
'Html'
),
array
(
'text'
=>
'text/plain'
,
'value'
=>
'Text'
)
))
->select(
'onTADropDownSelect'
);
function
onTADropDownSelect(e) {
var
value = e.sender.dataSource.options.data;
var
content = $(
'#content'
).data(
'kendoEditor'
);
for
(
var
i=0; i < value.length; i++) {
if
(value[i].value !=
'Text'
){
$(
function
() { $(
'#content'
).data(
'kendoEditor'
).wrapper.hide(); });
}
else
{
$(
function
() { $(
'#content'
).data(
'kendoEditor'
).wrapper.show(); });
}
if
(value[i].value !=
'Html'
){
$(
function
() { $(
'#content'
).data(
'kendoEditor'
).wrapper.hide(); });
}
else
{
$(
function
() { $(
'#content'
).data(
'kendoEditor'
).wrapper.show(); });
}
}
};
echo $dropDownList->render();
echo $editor->render();
Hello,
I have a problem when I'm trying to bind my data to a datasource with remote. If I bind it inline everything is fine and my chart looks like the first attached file. But with remote I get something like the second attached file.
The data I'm using for inline binding is this: var data = [{"Draft": 100, "Published": 200,"Deactivated": 50,"ChangeByVendor": 20}];
And the Data I receive from my endpoint with remote binding is following: "{\"Draft\": 100, \"Published\": 200,\"Deactivated\": 50,\"ChangeByVendor\": 20}"
The series field in my chart looks like this:
series: [{
name:
"@T("
Pim.Product.Enum.Published
")"
,
field:
"Published"
,
color:
"#48b159"
,
labels: {
visible:
true
,
background:
""
,
position:
"center"
,
template:
'#if (value > 0) {# #=kendo.format("{0:p}", percentage)# #}#'
}
}, {
name:
"@T("
Pim.Product.Enum.Draft
")"
,
field:
"Draft"
,
color:
"#f4a623"
,
labels: {
visible:
true
,
background:
""
,
position:
"center"
,
template:
'#if (value > 0) {# #=kendo.format("{0:p}", percentage)# #}#'
}
}, {
name:
"@T("
Pim.Product.Enum.Deactivated
")"
,
field:
"Deactivated"
,
color:
"#f42323"
,
labels: {
visible:
true
,
background:
""
,
position:
"center"
,
template:
'#if (value > 0) {# #=kendo.format("{0:p}", percentage)# #}#'
}
}, {
name:
"@T("
Pim.Product.Enum.ChangeByVendor
")"
,
field:
"ChangeByVendor"
,
color:
"#f42323"
,
labels: {
visible:
true
,
background:
""
,
position:
"center"
,
template:
'#if (value > 0) {# #=kendo.format("{0:p}", percentage)# #}#'
}
}],
For me, I don't understand why i get two so different result with inline and remote. What am I missing here? I would love to get the chart to look like the inline result but with a remote binding. I hope you can help me with that.
Best regards,
Dominik
Dear Support,
Is there are any options to lazy load the sheets as my excel sheet is large enough and browser gets hanged. Do i missing something or any workaround for that.Thanks in advance.
I have a grid where the display criteria is set by another control on the page, therefore sometimes I need to present an empty grid with all column filtering and sorting cleared. The only way I have been able to do this is with the following code:
grid.dataSource.query({
filter: {},
sort: {},
take: grid.dataSource.take(),
page: grid.dataSource.page(),
pageSize: grid.dataSource.pageSize(),
skip: grid.dataSource.skip()
}).then(function (e) {
grid.dataSource.data([]);
});
The problem with this code is the grid.dataSource.query causes a call to the service layer, which is extra traffic in the network, and seems unecessary since I am not presenting any data in the grid. Is there any other way of presenting an empty grid with column filtering/sorting cleared, that would not involve a call to the service layer?
Hi,
I have use custom validation function to my grid, it's fired twice every time. How to prevent this?
How to avoid kendo grid refresh after cell editing , when i edit a cell value that time databound event called it self ,so issue is when databound event called it self my kendo grid expanded row collapse automaticly so i need to re-expand again this row that not well taking lot time to expand again
here is Snapshot
$("#planViewDataGrid").kendoGrid({
columns: ParentGridJSON,
noRecords: true,
dataSource: sharedDataSource,
excel: {
allPages: true
},
//cancel: function (e) {
// lstGridDataSet = [];
//},
saveChanges: function (e) {
if (IsInlineEdit === "True") {
//dialog.data("kendoDialog").open().element.closest(".k-window").css({
// top: 100
//});
showInlineConfirmDialog();
//bindReasonCodeDropDown();
IsInlineEditDataBindReq = 0;
}
else {
showConfirmBox("Confirm Overrides", "Are you sure you want to override all changes?");
var kendoWindow = $("#confirmPopUpWindow");
kendoWindow
.find("#confirmYes")
.unbind("click").click(function () {
// showInProgress();
$("#confirmYes").off();
hideKendoConfirmWindow();
kendo.ui.progress($(bodyTag), true);
$(".k-grid-save-changes").addClass('disabled_button');
$(".k-grid-save-changes").css("pointer-events", "none");
$(".k-grid-button").addClass('disabled_button');
$(".k-grid-button").css("pointer-events", "none");
saveTimeSeriesData($("#planViewDataGrid"));
});
}
},
pageable: {
pageSizes: [10, 20, 30, 40, 50],
change: function () {
if (leavepage) {
expandedItems = [];
}
renderChart();
},
messages: {
display: Resources.resPagerDisplayMessage + footerLabel,
itemsPerPage: footerLabel + Resources.resPagerItemsPerPageMessage
}
},
requestStart: function () {
kendo.ui.progress($(bodyTag), true);
},
requestEnd: function () {
// kendo.ui.progress($(bodyTag), false);
},
editable: true,
toolbar: [{ template: '<Label ID="m_lblUpdateStatus" CssClass="updatestatus" class="text-right"/>' },
{ name: "save", text: "Save Overrides" }, { name: "button", text: "Cancel Overrides" },
{ template: '<img id="expandGrid" style="width:20px;margin-top:2px;margin-right:5px;cursor:pointer;" class="float-left" title="Maximize Grid" onclick="expandCollapseGrid()" src="../CollaborativePlanning/Images/maximize.png" />' },
{ template: '<a class="k-button float-left" id="btnExpandAll" onclick="return expandAll()">Expand All</a>' },
{ template: '<a class="k-button float-left" id="btnCollapseAll" onclick="return collapseAll()">Collapse All</a>' },
{ template: '<Input type="search" ID="m_txtProductSearch" placeholder="Product Hierarchy" class="mleft mright float-left"/>' },
{ template: '<Input type="search" ID="m_txtLocationSearch" placeholder="Location Hierarchy" class="mright float-left"/>' },
{ template: '<Input type="search" ID="m_txtChannelSearch" placeholder="Customer Hierarchy" class="float-left"/>' },
{ template: '<img class="findIcon float-left" title="Search" onclick="searchPlanView()" src="../Images/find.gif" />' },
{ template: '<img style="width:20px;margin-top:2px;" class="findIcon float-left" title="Remove Search" onclick="removeSearchPlanView()" src="../Images/delete.png" />' }
],
detailTemplate: '<div class="planViewDataGrid"></div>',
detailExpand: function (e) {
var grid = $("#planViewDataGrid").data("kendoGrid");
var expanded = $.map(grid.tbody.children(":has(> .k-hierarchy-cell .k-i-collapse)"), function (row) {
var index = $(row).data("uid");
var list = $("#planViewDataGrid").data("kendoGrid").tbody.find("tr.k-master-row");
if (list != undefined && list.length > 0) {
for (var i = 0; i < list.length; i++) {
if (list[i].getAttribute('data-uid') == index) {
if ($.inArray(i, expandedItems) == -1) {
expandedItems.push(i);
}
}
}
}
});
if (IsInlineEdit === "True") {
//disable non editable cells
$('.nonEditable').css({ pointerEvents: "none" });
if (IsInlineEditDataBindReq === 0) {
totalRenderChartRequest = totalRenderChartRequest + 1;
renderChart();
}
IsInlineEditDataBindReq = 0;
}
else {
totalRenderChartRequest = totalRenderChartRequest + 1;
renderChart();
}
},
detailCollapse: function (e) {
expandedItems = [];
var grid = $("#planViewDataGrid").data("kendoGrid");
var expanded = $.map(grid.tbody.children(":has(> .k-hierarchy-cell .k-i-collapse)"), function (row) {
var index = $(row).data("uid");
var list = $("#planViewDataGrid").data("kendoGrid").tbody.find("tr.k-master-row");
if (list != undefined && list.length > 0) {
for (var i = 0; i < list.length; i++) {
if (list[i].getAttribute('data-uid') == index) {
if ($.inArray(i, expandedItems) == -1) {
expandedItems.push(i);
}
}
}
}
});
totalRenderChartRequest = totalRenderChartRequest + 1;
renderChart();
},
dataBound: function () {
var grid = $("#planViewDataGrid").data("kendoGrid");
for (var i = 0; i < expandedItems.length; i++) {
//var rowToExpand = ">tr.k-master-row:nth-child(" + expandedItems[i] + ")";
if (IsInlineEdit === "True") {
IsInlineEditDataBindReq = 1;
}
// grid.expandRow(grid.tbody.find("tr.k-master-row")[expandedItems[i]]);
var rowToExpand = $("#planViewDataGrid").data("kendoGrid").tbody.find("tr.k-master-row")[expandedItems[i]];
if (rowToExpand != undefined) {
grid.expandRow(rowToExpand);
//grid.expandRow(grid.tbody.find("tr[data-uid='" + expandedItems[i] + "']"));
}
}
$("div.k-grid-content .k-auto-scrollable").scrollLeft(leftValue);
$('div#planViewDataGrid div.k-grid-content.k-auto-scrollable').scrollTop(gridScrollTop);
// renderChart();
kendo.ui.progress($(bodyTag), false);
},
detailInit: function (e) {
//Model values to be used when saving forecast changes
e.data.Timeseries.forEach(function (item, index) {
if (item.UpdateSummaryTimeSeries != null) {
if (lstTsIds.indexOf(item.UpdateSummaryTimeSeries) < 0) {
lstTsIds.push(item.UpdateSummaryTimeSeries);
}
}
});
e.detailRow.find(".planViewDataGrid").kendoGrid({
resizable: true,
columns: dynamicColumns,
dataSource: e.data.Timeseries,
editable: true,
edit: function (e) {
var gridDataSet = {
LocationHierarchyField: '',
LocationHierarchy: '',
ProductHierarchy: '',
ProductHierarchyField: '',
ChannelHierarchyField: '',
ChannelHierarchy: '',
Period: '',
Value: '',
TemplateId: templateId,
TimeseriesId: '',
ReasonCode: '',
Comments: '',
Id: ''
};
var input = e.container.find(".k-input");
var oldValue = input.val().replace(/,/g, '');
var value = input.val();
var name = input[0].nextElementSibling.name;
var parent = $("#planViewDataGrid").data("kendoGrid").dataItem(e.sender.element.closest("tr").prev());
gridDataSet.LocationHierarchy = parent.LocationHierarchy;
gridDataSet.LocationHierarchyField = parent.LocationHierarchyField;
gridDataSet.ChannelHierarchy = parent.ChannelHierarchy;
gridDataSet.ChannelHierarchyField = parent.ChannelHierarchyField;
gridDataSet.ProductHierarchyField = parent.ProductHierarchyField;
//gridDataSet.ProductHierarchy = parent.HasChild ? parent.ProductHierarchy : parent.ProductHierarchy.split(":")[0];
gridDataSet.ProductHierarchy = parent.HasChild ? parent.ProductHierarchy : parent.ProductId;
gridDataSet.Period = name;
gridDataSet.TimeseriesId = e.model.TimeSeriesId;
gridDataSet.Id = input.context.id;
//gridDataSet.ReasonCode = reasonCode;
//gridDataSet.Comments = comments;
if (IsInlineEdit === "True") {
IsInlineEditDataBindReq = 1;
}
//GET SCROLLBAR POSITION
var oBody = document.body;
var oDoc = document.documentElement;
topValue = oBody.scrollTop > oDoc.scrollTop ? oBody.scrollTop : oDoc.scrollTop;
leftValue = $("div.k-grid-content .k-auto-scrollable").scrollLeft();
gridScrollTop = $('div#planViewDataGrid div.k-grid-content.k-auto-scrollable').scrollTop();
input.focusout(function () {
value = input.val().replace(/,/g, '');
gridDataSet.Value = value;
if (IsInlineEdit === "True") {
IsInlineEditDataBindReq = 1;
}
if (oldValue != value) {
//if (IsInlineEdit === "False") {
$(".k-grid-save-changes").removeClass('disabled_button');
$(".k-grid-save-changes").css("pointer-events", "visible");
$(".k-grid-button").removeClass('disabled_button');
$(".k-grid-button").css("pointer-events", "visible");
//}
for (var i = 0; i < lstGridDataSet.length; i++) {
if (lstGridDataSet[i].Id == gridDataSet.Id && oldValue != value) {
lstGridDataSet.splice(i, 1);
}
}
lstGridDataSet.push(gridDataSet);
//Adding overriden cells ids to list, as we have to show them in different color
if (lstOverriddenIds.indexOf('#' + gridDataSet.Id) == -1) {
lstOverriddenIds.push('#' + gridDataSet.Id);
}
UpdateSummaryTimeSeries(gridDataSet, lstTsIds);
//if (IsInlineEdit === "True") {
// saveTimeSeriesDataInline($("#planViewDataGrid"));
//}
// SCROLLBAR RESTORE POSITION
try {
oBody.scrollTop = topValue;
oDoc.scrollTop = topValue;
$("div.k-grid-content .k-auto-scrollable").scrollLeft(leftValue);
$('div#planViewDataGrid div.k-grid-content.k-auto-scrollable').scrollTop(gridScrollTop);
}
catch (e) {
console.log(e);
}
}
});
},
dataBound: function (e) {
}
});
$("#planViewDataGrid").resize();
if (lstGridDataSet.length == 0) {
$(".k-grid-save-changes").addClass('disabled_button');
$(".k-grid-save-changes").css("pointer-events", "none");
$(".k-grid-button").addClass('disabled_button');
$(".k-grid-button").css("pointer-events", "none");
}
//renderChart();
}
});
Hello,
When I attempt to export a Kendo Grid to Excel that has a couple of fields that contain string array data, the data from those columns do not get exported to the Excel spreadsheet. Exporting this same grid to a PDF works just fine. I'm using the saveAsExcel() method and saveAsPDF() methods respecitvely.
Any known issues with the saveAsExcel method that would cause this?
Regards,
Jason