I am doing server validation on my create and update requests. However this causes an issue when updating a recurring event as it triggers both a create and update in some situations.
How can I "merge" 2 requests into 1 e.g. when making a recurrence exception by editing only single event?
Note: the documentation on the Kendo menu provides how to close an item, but not the actual menu itself.
For example, the menu documentation on the Kendo menu states:
//intialize the menu widget
$("#menu").kendoMenu();
// get a reference to the menu widget
var menu = $("#menu").data("kendoMenu");
// close the sub menu of "Item1"
menu.close("#Item1");
There is a bug setting the percentage width for a table within the Kendo editor.
1. Go to https://demos.telerik.com/kendo-ui/editor/index
2. Under Editor / Basic usage select the Table Wizard Icon and click Table Wizard to bring up the Wizard Dialog
3. You will notice that within this dialog the unit options for width and height are only px and em
4. Within this dialog create a table two columns and four rows
5. Place your cursor in one of the table cells again and click the Table Wizard button again to edit the propertied of the new table
6. The unit options for width and height are still only px and em. Go ahead and enter 100px into the width field and click Ok on the dialog
7. Once again with you cursor in one of the table cells, click the Table Wizard button again. Now the units options for all widths and heights for tables and cells are px, em and importantly %
8. If I now create a new table via the Table Wizard the unit options available are px, em and % as expected
I logged a previous, different bug about the Table Wizard in github here: https://github.com/telerik/kendo-ui-core/issues/4390 but have had no response, so is this the correct place for bug reports, or github?
I have created a drop down list embedded within my grid using the demo: https://demos.telerik.com/kendo-ui/grid/editing-custom
For some reason when I select an option within the drop down it doesn't send the data back in a format the grid can use, however the default value (if I don't touch drop down) works just fine.
My datasource designed as such:
schema: {
model: {
id:
"SwitchID"
,
fields: {
SwitchID: { editable:
false
, type:
"number"
},
switchperson: {
type:
"string"
,
validation: { required:
true
, message:
"Switchperson information is required."
},
},
phoneNum: { type:
"string"
},
Location: { type:
"string"
},
SwitchPersonType: { defaultValue: { switchPersontypeValue:
"Employee"
, switchPersontypeID: 1 } },
//SwitchPersonType: { type: "string" },
},
},
},
and the kendo grid:
$(
"#switchpersonTable"
).kendoGrid({
dataSource: switchpersonDataSource,
scrollable:
true
,
sortable:
true
,
filterable:
false
,
pageable:
true
,
toolbar: [{ name:
"create"
, text:
"Add Switchperson"
}],
columns: [
{ field:
"switchperson"
, title:
"Switchperson"
, width:
"200px"
},
{ field:
"phoneNum"
, title:
"Phone #"
, width:
"200px"
},
{ field:
"Location"
, title:
"Location"
, width:
"200px"
},
{
field:
"SwitchPersonType"
,
title:
"Type"
,
width:
"150px"
,
template:
"#=SwitchPersonType.switchPersontypeValue#"
,
editor: switchPersonTypeDropDownEditor,
},
{ command: [
"edit"
,
"destroy"
], title:
" "
, width:
"200px"
},
],
editable:
"inline"
,
});
The editor is the built like this:
$(
'<input required name="'
+ options.field +
'" data-text-field="switchPersontypeValue" data-value-field="switchPersontypeID" data-bind="value:'
+
options.field +
'"/>'
)
.appendTo(container)
.kendoDropDownList({
autoBind:
false
,
dataSource: {
data: ddlSwitchPersonType,
},
});
and the data source for the drop down list:
var
ddlSwitchPersonType = [
{
switchPersonTypeID: 1,
switchPersontypeValue:
"Employee"
,
},
{
switchPersonTypeID: 2,
switchPersontypeValue:
"Contractor"
,
},
];
If I create an item in the grid and don't touch the dropdown I get the following back in the e.data:
Location: ""
SwitchID: 0
SwitchPersonType:
switchPersontypeID: 1
switchPersontypeValue: "Employee"
__proto__: Object
phoneNum: ""
switchperson: "sdaf"
__proto__: Object
But if I select an option (even the default) the data doesn't come back as an object. It only sets a field called SwitchPerson
Location: ""
SwitchID: 0
SwitchPersonType: "Employee"
phoneNum: ""
switchperson: "sdf"
__proto__: Object
Any thoughts on the cause of this?
Thanks in advance
I have a page that has a value of fleetId that is set by the Router Object. I also have a dropdown list that is populated with a datasource. How can I set the selected value when the page(template) first loads? It works if I set it to a function in the view model but that creates another set of problems (the onChange won't work)
<script id="index" type="text/x-kendo-template">
<input data-role="items"
data-bind="source: channelFleets, value: selectedfleet,
events: {
change: onChange,
}"
data-text-field="fleetText"
data-value-field="fleetId"
/>
</script>
---------viewmodel.js-----------------------
var viewModelIndex = kendo.observable({
fleetId: "",// Set by Router
selectedfleet: "",
// Changing the databinding value to this does work.
//selectedfleet: function() {
// return this.fleetId;
// },
items: [
{ fleetId: "Fleet 1", fleetText: "Fleet 1" },
{ fleetId: "Fleet 2", fleetText: "Fleet 2" },
{ fleetId: "Fleet 3", fleetText: "Fleet 3" }
],
onChange: function() {
var selectedFleet = this.get("selectedfleet");
router.navigate("/operations/fleet/" + selectedFleet);
},
});
Hi,
We are using Kendo Grid control. I have one field which is editable in the grid. Initially, the grid remains in view mode. There is a button outside the grid. Upon clicking the Edit button, I want to make the whole column in edit mode. I want that the whole column should now have textboxes instead of the label. How can I achieve that in Kendo? I am using Kendo Batch editing, but the problem with inline editing mode is, we can only keep one row in edit mode, not all at once.
I found below thread having the same issue as mine but couldn't find the answer.
https://www.telerik.com/forums/dynamically-changing-template-of-a-column-to-make-it-editable
Thanks & Regards,
Ankush Jain
I am trying to change the color of the shape by using the below code. but not working by any way.
please advice what I need to change to set new color to the shape
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.default.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.mobile.all.min.css">
<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.1.220/js/angular.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.1.220/js/jszip.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.1.220/js/kendo.all.min.js"></script></head>
<div id="diagram"></div>
<script>
function createDiagram() {
$("#diagram").kendoDiagram({
editable: {
rotate: false,
resize: false
},
pannable: false,
zoomMax: 1,
zoomMin: 1,
shapeDefaults: {
visual: visualTemplate,
connect: false
},
connectionDefaults: {
editable:
{
drag: false
}
}
});
}
function Data() {
try {
var diagram_data = $("#diagram").data("kendoDiagram");
var diagram = $("#diagram").getKendoDiagram();
diagram_data.dataSource.add({
mac_id: "#12345",
power_of_battry_value: "100",
humidity: "60%",
temperature: "33",
});
//working fine
diagram.shapes[0].position(new kendo.dataviz.diagram.Point(50, 50));
// working fine
diagram.shapes[0].dataItem.mac_id = "mac_id";
diagram.shapes[0].dataItem.humidity = "humidity";
diagram.shapes[0].dataItem.temperature = "temperature";
diagram.shapes[0].redrawVisual();
// not working
diagram.shapes[0].options.fill.color = "black";
diagram.shapes[0].redraw();
// not working
diagram.shapes[0].options.fill.color = "black";
diagram.shapes[0].redrawVisual();
// not working
diagram.shapes[0].redraw({
fill: {
color: "black"
}
});
}
catch (e)
{ alert(e); }
}
$(document).ready(function () {
createDiagram();
Data();
});
function visualTemplate(options) {
var dataviz = kendo.dataviz;
var dataItem = options.dataItem;
var g = new dataviz.diagram.Group({ id: dataItem.mac_id.trim() } );
g.append(new kendo.dataviz.diagram.Rectangle({
id: dataItem.mac_id.trim(),
width: 140,
height: 75,
x: 0,
y: 0,
fill: {
color: "blue"
}
}));
g.append(new dataviz.diagram.TextBlock({
text: dataItem.mac_id.trim(),
x: 10,
y: 10,
fill: "#fff"
}));
g.append(new dataviz.diagram.TextBlock({
text: "T: " + dataItem.temperature,
x: 10,
y: 25,
fill: "#fff"
}));
g.append(new dataviz.diagram.TextBlock({
text: "H: " + dataItem.humidity,
x: 10,
y: 40,
fill: "#fff"
}));
return g;
}
</script></body>
</html>
Hello,
After I changed node's display text in client side the node become not selectable. for example I have treeview as below:
$("#treeview").kendoTreeView({
dataSource: [
{ text: "foo", id:"1", items: [
{ text: "AAA",id:"2" } ] }
]
});
I changed "AAA" to "BBB" by button click (see below code). after that I cannot select that node anymore. the node with 'BBB' function as a LABEL. Does anyone has idea how to resolve it?
$("#btn").click(function(){
var treeview = $("#treeview").data("kendoTreeView");
var myDataItem=treeview.dataSource.get(2);
var node = treeview.findByUid(myDataItem.uid);
node.text("BBB");
treeview.select(node);
});
I am using kendo grid column editor to get autocomplete values in each cell in a column.
If my selected text is digit, then its selecting [object Object] for the first time and after that if I select again different digit, it will select the digit.
And it doesn't happens with the alphabet/alphanumeric text values.
In the below code, If I am selecting "50", it is giving [object Object].
And if I am selecting Test 65/ Test, it will not change.
And if I add space in text ("50 "), them this value will also not change.
please check and resolve the issue.
$('<input data-text-field="text" data-value-field="value" data-bind="value:' + options.field + '"/>')
.appendTo(container)
.kendoAutoComplete({
autoBind: false,
suggest: true,
filter: "contains",
index: 1,
minLength: 1,
dataSource: [
{ text: "50", value: "50"},
{ text: "60", value: "60" },
{ text: "Test 65", value: "65" },
{ text: "Test", value: "23" },
{ text: "64", value: "64" },
{ text: "20", value: "20" }
]
});