Hi , I'm experiment some issues with kendo UI Jquery , and KendoVue and i want to share them , maybe its goona help some furter development o just to having in  mind, talking with the voice of a little development team from latam , first of all kendo was a huge help in our development team , we use all the componentes of the UI daily , but we found some insolved error in some widgets and in the end of the day we prefer to use other tecnics , if you can at least take a moment to check it in furter updates will be a great help .
Our Issues beggins with the level of costumization of a grid and growing up after that , re create the error in a dojo will take us some time and mostly is because are to many ways to get there. some of the issues are.

- When you use the " refresh" method of the jquery grid several times , and after that you use customized buttons on the same grid without reload the entire frame/page, the accion of the button is executed as many times as you fire the "refresh" method .

- The Kendo UI jquery grid check button column as is provided for the UI ,doesnt suppor the incorporation of customized acction buttons , in some randomly ocations doesnt fire the event's

-When you have a widget that display a k-list like multiselect , dropdown , combobox mounted in a kendo window , if the k-list is too long the z-index of the element is the same of the window and make a effect of "cuted data "  , some other users have the same issue https://www.telerik.com/forums/kendodatepicker-z-index

- In kendo Vue , change de data source of a mounted element is imposible if you not use the kendo-vue-datasource component , you have to re build the entire element,

That some of the issues we have experiment , thank you for your time.

Hi,

I have implemented the treeview which has roughly 3000 to 5000 multilevel json objects.The treeview takes lots of time to load and render and fails sometimes. I have some concerns in implementing the treeview,

* I had to apply checkbox checkchildren option to keep the selected & unselected nodes.

* I couldn't apply neither loadondemand nor remote data binding option since i wanted whole datasource for storing and retrieving purpose from the db.

If I apply checkchildren option the browser hangs and kills the script. The treeview loading faster if checkchildren is set to false. I have tried with setTimeout option to enable the checkchildren after loading the treeview, but again it hangs whenever its getting applied to the treeview.

I have an example from this below link.

http://jsfiddle.net/paulrajj/ymxgfb7p/

Kindly let me know if is there any work around or solutions to solve this issue. Thanks.

Events maybe have some different types , I want if it has type 1 give it title one circle color , has type 2 give other color..... and so on

So maybe one event has multiple colors, how to do this?

Hi, 

I've been using Kendo jquery UI for only one month. I have created a kendo tree, now I can properly rename each node with inline editing.

At the time of renaming a node i made this inline editable using Jeditable library. But after editing the node text only when I'm pressing ENTER button then only it's saving the node text. I want to save this changed node text  also when I click out side of the tree. Anyone can help me please?

This rename thing happening under the kendoContextMenu, Please go through the code below:

$("#menu").kendoContextMenu({
                target: "#treeview",
                filter: ".k-in",
                select: function (e) {
                    e.preventDefault();
                    var button = $(e.item);
                    var node = $(e.target); 
                    console.log(node)
                    var treeView = $("#treeview").data("kendoTreeView"); 
                    var buttonSelect = $(e.item).children(".k-link").text();
                    switch (buttonSelect) {

    case "Rename":
                            node.editable(function (value, settings) {
                                console.log(value)
                                return value;
                            }, {
                                    event: "click",
                                    cssclass: "treeInlineEdit"
                                })
                            node.trigger("click", [e]);
                            break;

      }        
                },

 })

Hello,
Could you provide example of setting the range of daterangepicker using mvvm?

Thx,

Pierre

How do you tell if the panel is currently visible or hidden?

It seems to lack a "State" property, and show/hide events?

Could these be added, or are there existing properties/events I could use?

The Open/Close events appear to only fire when it is opened/closed MANUALLY?

Hi,

Does Kendu Editor provide support to implement MathJaX for mathmatcal equations?

https://www.mathjax.org/

Thanks!

Ravi K SIngh

I have a kendoMap with dataSource transport read which loads the locations for the markers. Because it loads thousands of coordinates I would need a progress bar on the map to let the user know that the map is loading. Is this possible? I'm using Bing type map.

$("#map").kendoMap({
            center: centerCoordinates,
            zoom: zoomLevel,
            layerDefaults: {
                bing: {
                    culture: "hu-HU"
                }
            },
            layers: [
                {
                    type: "bing",
                    imagerySet: "road",
                    key:"XXXXXXXXXXXXX"
                },
                {
                    dataSource: {
                        transport: {
                            read: {
                                url: url,
                                type: 'GET',
                                contentType: "application/json; charset=utf-8",
                                dataType: 'json',
                                data: json
                            }
                        }
                    },
                    type: "marker",
                    locationField: "LatLng",
                    titleField: "Name",
                    shape: "pin"
                }],
            markerActivate: function(e) {
                e.marker.element.addClass(e.marker.dataItem.Color);
            },
            markerClick: function (e) {
                //some more code exists here...
            },
            zoomEnd: zoomEndControl,
            pan: panControl,
            panEnd: panEndControl
        });

I have need to create kendo auto completes dynamically, where each one could potentially have thousands of records... Thus, I am wanting to call my controller, get data from a Salesforce database based on the current search, then reset the dataSource of the auto complete with returned data in the filtering event.

My code is: 

if(fieldMap[i].fieldType == 'REFERENCE'){
                      extraString = '<div class="k-edit-label"><label for="'+fieldMap[i].fieldName+'Input">'+fieldMap[i].fieldLabel+'</label></div><div data-container-for="'+fieldMap[i].fieldName+'Input" class="k-edit-field" id="'+fieldMap[i].fieldName+'Container">';
                            dynamicComponent = '<select id="'+fieldMap[i].fieldName+'Input" type="text" data-role="dropdownlist" style="width: 150px">';
                            optString = '';
                            for(var k = 0; k < fieldMap[i].referenceList.length; k++){
                                if(k == 0){
                                optString += '<option value="'+fieldMap[i].referenceList[k]+'" selected>'+fieldMap[i].referenceList[k]+'</option>';   
                                } else{
                                optString += '<option value="'+fieldMap[i].referenceList[k]+'">'+fieldMap[i].referenceList[k]+'</option>';   
                            }
                            }
                            optString += '</select>';
                            var inputString = '<input data-role="autocomplete" data-filter="contains" data-source="testData" id="'+fieldMap[i].fieldName+'SearchInput"/></div>';
                            dynamicComponent = dynamicComponent + optString + inputString;
                            
                        }
                    
                    extraString += dynamicComponent;
                        //editorTemplateString += extraString;
                    $('#editor_template').append(extraString);
                        extraString = '';
                        dynamicComponent = '';
                        if(fieldMap[i].fieldType == 'REFERENCE'){
                            kendo.init($('#'+fieldMap[i].fieldName+'SearchInput'));
                            var autoComp = $('#'+fieldMap[i].fieldName+'SearchInput').data('kendoAutoComplete');
                            autoComp.bind('filtering', autoComplete_filter);
                            console.log($('#'+fieldMap[i].fieldName+'SearchInput').data('kendoAutoComplete'));
                            
                        }
                    }

which seemingly seems to successfully create kendo auto complete widgets with dummy data in testData right now. However, autoComplete_filter method is never being called when I type in the box. That method is simply:

function autoComplete_filter(e){
                console.log(e);   
                }

right now... but nothing prints out in the console when I type in the auto complete box.

How do I set the filtering event on dynamically created auto completes like this? Also, how can I set the minLength to three? It starts filtering after the first character entered and I only want it to start after 3 or more are entered.

Thank you for any help.

Is is possible to add a tooltip to the entire row of a grid?  I currently can add a tooltip to each column template but was wondering if I could just have the tooltip appear on any item in the entire row?   

This is solution I am looking for but in a MVVM implementation
https://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/Layout/grid-with-kendo-ui-tooltip

<div id="grdWarningndex" data-role="grid"
  data-editable="false"        
  data-sortable="false"       
  data-columns="[
                    { 'field': 'WarningStatus', 'width': 5,'title': 'WarningStatus' ,template: '<span data-role=\'tooltip\' title=\'The warning status tooltip is: #=WarningStatus# \'> #=WarningStatus#</span>' },
                    { 'field': 'WarningMessage', 'width': 100,'title': 'WarningMessage','template': '<span data-role=\'tooltip\' title=\'This is the message tooltip \'> <a href=/=#=WarningMessage# data-bind=\'click: goToView2\' >#=WarningMessage# </a> </span>'  },
                    { 'field': 'WarningAction', 'width': 100,'title': 'WarningAction','template': '<a href=/=#=WarningAction#  data-bind=\'click: goToView3\' >#=WarningAction#  </a>'  },                   
                    { 'field': 'WarningTime', 'width': 150,'title': 'WarningTime(EST)' },     
                                                   ]"                                
                                                
                                                
                                                 data-bind="source: dsWarnings, events: { dataBound: dsWarnings }"  
                                                 style="height: 300px"
                                                 >