Hi, when i use the label buttons to hide a series the valueAxis adjusts to the remaining series and it changes the proportion of areas which looks really weird in a graph that doesn't even show the valueAxis like the one i have in production. I've found a workaround and i have it in this dojo but it feels kinda hacky and weird, is there a simpler way to maintain the valueAxis value and hide a series from the user view?.
the code of the solution is this:
function onLegendItemClick(e) { e.preventDefault(); var serie = e.sender.options.series[e.seriesIndex] serie.opacity = serie.opacity === 0 ? 0.4 : 0; serie.markers.size = serie.markers.size === 0 ? 6 : 0; serie.tooltip.visible = serie.tooltip.visible === false ? true : false; var chart = $("#chart").data("kendoChart"); chart.refresh(); console.log(serie); console.log(e.sender);}Hello!
I wish to add functionality to the MultiSelect in order to capture the "paste" event, parse the input and if any values in the pasted input match are options to the MutliSelect, select them.
Below is the code I used to extend the MutliSelect. The parsingMutliSelect.value(...) call is indeed changing the values, however the UI is not updating and displaying the values as tags within the input field for the MultiSelect. In fact, the error "TypeError: Argument 1 of Node.removeChild is not an object" keeps occurring when the parsingMultiSelect._change() call is made. This error occurs at the line "tagList[0].removeChild(tagList[0].children[removedItem.position]);" within the _selectValue function definition within the MultiSelect configuration (kendo.multiselect.js).
Using my FireBug console, I can successfully get the MutliSelect to perform as expected by using the .value() and .trigger("change") methods on the MultiSelect instance. Why can I not seem to successfully set values from within the MutliSelect extension definition?
01.(function ($) {02. 03. var kendo = window.kendo,04. ui = kendo.ui,05. MultiSelect = ui.MultiSelect,06. CHANGE = "change",07. PASTE = "paste";08. 09. var ParsingMultiSelect = MultiSelect.extend({10. 11. init: function (element, options) {12. var that = this;13. 14. // Base call to MultiSelect to initialize ParsingMultiSelect15. MultiSelect.fn.init.call(that, element, options);16. 17. that.input.on(PASTE, that, that._paste);18. },19. 20. options: {21. // Assigns the name as it should appear off the kendo namespace (i.e. kendo.ui.ParsingMultiSelect).22. // The jQuery plugin would be jQuery.fn.kendoParsingMultiSelect23. name: "ParsingMultiSelect"24. },25. 26. events: [27. PASTE28. ],29. 30. _paste: function (e) {31. alert("data pasted!");32. var parsingMultiSelect = e.data,33. dataValueField = parsingMultiSelect.options.dataValueField,34. parsingMultiSelectDataSource = parsingMultiSelect.dataSource,35. pastedData = e.originalEvent.clipboardData.getData('text'),36. validValues = [];37. 38. multiSelect._close();39. 40. parsingMultiSelectDataSource.fetch().done(function () {41. var dataSourceData = parsingMultiSelectDataSource.data();42. var dataSourceValues = [];43. 44. if (dataSourceData instanceof kendo.data.ObservableArray) {45. dataSourceValues = dataSourceData.map(function (arrayElement, index) {46. return arrayElement[dataValueField];47. });48. }49. 50. // Convert all commas to a single space then reduce all whitespace (and consecutive)51. // characters in the pasted input to a single space to get ready for splitting52. pastedData = pastedData.replace(/,/g, "").replace(/\s\s+/g, " ").trim();53. 54. pastedValues = pastedData.split(" ");55. 56. // Loop through the values pasted in. If any exist in the dataSource, push them to57. // the array of valid values.58. $.each(pastedValues, function (index, value) {59. if (dataSourceValues.indexOf(value) != -1) {60. validValues.push(value);61. }62. });63. 64. parsingMultiSelect.value(e.data.value().concat(validValues));65. parsingMultiSelect._change();66. });67. 68. e.preventDefault();69. }70. });71. 72. // Add the ParsingMultiSelect to Kendo UI73. ui.plugin(ParsingMultiSelect);74. 75.})(jQuery);76. 77. 78.$("#parsingmultiselect").kendoParsingMultiSelect({79. dataSource: [80. { unitId: "0001X" },81. { unitId: "0002X" },82. { unitId: "0003X" },83. { unitId: "0004X" },84. { unitId: "0005X" },85. { unitId: "0006X" }86. ],87. dataTextField: "unitId",88. dataValueField: "unitId",89. placeholder: "Select a Unit ID..."90.});...and a jsFiddle: https://jsfiddle.net/Lvvwzmyv/3/. Try pasting a single value: "0002X" and try pasting multiple values: "0002X, 0004X, 0005X" and observe the unintended behaviour.
Thank you,
R. J.

We are not able to scroll the Kendo Popup Window contents on IPad IOS 9.
Scroll works on Ipad IOS 8 though.
Have we found any solution for such issue?

What if i want to use a Font Awesome spinner as progress indicator on a KendoGrid
Is there any CSS template for that?
If i wanted to use etc. <i class='fa fa-spinner fa-pulse'></i>
Could maybe imagine something like
.k-loading-image {
content: "\25AE";
font-family: FontAwesome;
background-image: none;
}
But would that be the correct way to do it?
Hey guys,
Been putting together a solution using kendo ui grids and AngularJS, but hit the wall when trying to perform CRUD operations in a nested grid. I did do some research but couldn't get an straight answer so this is my last resource.
As I said, got grid inside a grid, and I need to be able to perform CRUD operations. This is what the markup looks like
<div kendo-grid="firstgrid" k-options="context.gridOptions">
<div k-detail-template>
<div kendo-grid="secondgrid" k-options="secondGridOptions(dataItem)"></div>
</div>
</div>
nothing especial there, here's the secondGridOptions function
$scope.secondGridOptions = function (dataItem) {
return {
dataSource: {
transport: {
read: "api/Entity/" + dataItem.ID,
update: function (options) {
angularResourceSvc.entity.update({}, options.data, function (response) {
console.log(response);
});
},
destroy: function (options) {
angularResourceSvc.entity.delete({ id: options.data.Id}, function (response) {
console.log(response);
});
},
create: function (options) {
options.data.RAID = $stateParams.RAID;
angularResourceSvc.entity.save({}, options.data, function (response) {
console.log(response);
});
}
}
},
I've omitted the rest of the function for brevity (schema, columns etc)
As you can see I'm using an angular service to perform the operations, and this is what I've used on all the other grids in the app, which works pretty well.
Normally this is what my read looks like:
read: function (options) {
options.success($scope.dataCollection)
},
and this is how I call it whenever I need to get/refresh the data
$scope.dataCollection = rangularResourceSvc.entity.query({}, function (result) {
$scope.mygrid.dataSource.read();
});
But since this is a function (as opposed to a kendo data source) I didn't really know how to "read" the data like I've done in my other grids, so I decided to just use the url.
Reading the data works fine, but that's about it. It won't update, delete or create... nothing happens, no error message, nothing.. the events just won't fire.
Did a little but of digging on this and found a post where it says that all CRUD operations had to be the same, so either reading straight from the Url or a function; so I changed the read operation to a function (a bit of a hack really) so it'd read "local" data that I'm just pulling onload.. but same thing, rows are fine, grid gets displayed properly, but that's as far as it'll go.
Any help would be very much appreciated
Hi,
I think the close event of the popover does not fire when closing via button in the popover.
It only seems to fire when the popover is closed by clicking outside of the popover window.
See http://dojo.telerik.com/EbEJO
Thanks for your help.
Henri
I've got a local variable in javascript that is a dictionary object. on inline edit of a row, I want to have the column edit mode be a dropdownlist where the data source is the list of keys in the dictionary and the selected key is the value from the row in the grid. How can I set the data source of the dropdownlist to be the key in my local dictionary?
I've looked at this demo but the data is remote. I want to specify the data source to be local from the key of the dictionary object.
http://demos.telerik.com/kendo-ui/grid/editing-inline
Thanks,
--Ed
Hello,
I created a project following the same methods as this project to build a scheduler with custom views. The issue I'm running into is that the code
//detach events destroy: function () { if (this.element) { this.element.off(NS); } ui.SchedulerView.fn.destroy.call(this); }never executes when I select another view. Instead, the view stays in place and the view I selected appears below it. If I toggle between my two custom views, they will simply stack. Is there any reason you now of why this might happen? Let me know if I need to upload a project, but it will take time to make it so it can be downloaded and run with minimal changes.
Thanks for your help!
Hi,
we are trying to use a kendo grid with angular, as follow
http://plnkr.co/edit/AkKBtTVWRrhvJyF8Kmfd?p=preview
and we found a strange behaviour: if you try to delete all the elements in the grid, you will see that the last one will persist in the angular tables.
Can you help us to understand why?
Thanks