Hello,

I have a use case where I want to change the event function (_dialogActionOK, _dialogInitOpen, _dialogOpen) called by the dialog window runtime.

What is the simplest way to change the functions called runtime?

$('#dialog').initOpen( function(e) { newMethod(); }) ?

Thanks for the help

I'm trying to implement a Kendo splitter pane with dynamically allocated number of panes in Angular 2. I have the kendo-splitter element in the parent component but unless I remove it the child component doesn't get rendered? 

Parent Splitter Component

Hi

I have issue selecting first tab, I read  in https://www.telerik.com/forums/can-t-programmatically-select-a-tab#8GpHjbXuJkyTYw-siBriCw that the issue can be because of the external dataSource. I use the example from http://demos.kendoui.com/web/tabstrip/images.html to create my json. here is part of my code. Any idea?

var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "/api/GetTabs/",
dataType: "json",
type: "POST"
},
parameterMap: function (data, type) {
var result = {
val1: $("#val1").val(),
val2: $("#val2").val(),
}
return kendo.stringify(result);
}
},
});

$("#tabstrip").kendoTabStrip({               
dataTextField: "resId",
dataContentUrlField: "resName",
dataSource: dataSource
                
            });

function SelecTab() {    
var tabStrip = $("#tabstrip").kendoTabStrip().data("kendoTabStrip");
tabStrip.select(1);
}

Kendo grids in our application are not sizing optimally with Chrome 65.  Our grid columns still size efficiently and as expected in Chrome 64, and the latest of Firefox, IE 11, and Edge. 

Attachment 1 shows one of our grids, rendered in Chrome 65.  Here you can see that the columns which would normally be wider, to accommodate wider text, are too thin, and columns which do not have a lot of text are too wide.

Attachment 2 shows the same grid as rendered in Firefox.  (Also renders this way in Chrome 64, IE 11 and Edge)

Attachment 3 shows that a forced redraw of the grid columns, by executing the following code, corrects the column sizing issues.  Perhaps Chrome has become faster, and exposed a timing issue around column width calculations after options.success is called following a transport.read?

                                                //The following is executed after the return of data from an external query made in
                                                //kendo.data.DataSource.transport.read
                                                //Attachment 1 is from just prior to this code's execution.
                                                //Attachment 2 is from after showColumn(3) is execcuted
                                                window.setTimeout(angular.bind(this,
                                                    () => {
                                                        $("#ehGrid").data("kendoGrid").hideColumn(3);
                                                        window.setTimeout(angular.bind(this,
                                                                () => {
                                                                    $("#ehGrid").data("kendoGrid").showColumn(3);
                                                                }),
                                                            100);
                                                        }),
                                                    300);

This issue is occurring in multiple grids in our app, so having to put this workaround into all our transport.read definitions is not a great solution for us.  Do you have any other suggestions or a fix? 

Kendo 2017.1.223, Angular v1.6.5, Typescript

Hello,

in this example http://dojo.telerik.com/aJUKiZuB I reproduced a problem with the dropdown. When you open it and directly close it (before its opened) by clicking i.e. below, there is a faulty animation, where the dropdown animation container jumps to a wrong position. With jQuery 1 its working fine. Same problem seems to be on multiselect (maybe also on other widgets?).

Regards

Jan

I would like to collapse all of the nodes in the treeview and then expand the treeview to a specific node. I have found that when i call the collapse function like treeview.collapse('.k-item') and then try to call treeview.expandTo(dataItem) the treeview closes and does not expand to the node. In order to get it to work I have to delay the expandTo by using setTimout. This is not ideal. Any help would be appreciated.

Dojo example: http://dojo.telerik.com/ATiXUbuC

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Untitled</title>

  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.1.221/styles/kendo.common.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.1.221/styles/kendo.rtl.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.1.221/styles/kendo.default.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.1.221/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/2018.1.221/js/angular.min.js"></script>
  <script src="https://kendo.cdn.telerik.com/2018.1.221/js/jszip.min.js"></script>
  <script src="https://kendo.cdn.telerik.com/2018.1.221/js/kendo.all.min.js"></script></head>
  
<div id="example">

            <div class="demo-section k-content">
                <h4>Inline data (default settings)</h4>
                <div id="treeview-left"></div>
              <button onclick='expandTo()'>Expand To</button>
              <span><--works as expected</span><br/>
              <button onclick='find()'>Collapse then expand to node</button>
              <span><-- sometimes works on first time, but stops working</span><br/> 
              <button onclick='findWithDelay()'>Collapse then expand to node (with delay)</button>
              <span><-- works everytime
              
            </div>

            <script>
                var inlineDefault = new kendo.data.HierarchicalDataSource({
                    data: [
                        { text: "Furniture", items: [
                            { text: "Tables & Chairs" },
                            { text: "Sofas" },
                            { text: "Occasional Furniture" }
                        ] },
                        { text: "Decor", items: [
                            { text: "Bed Linen" },
                            { text: "Curtains & Blinds" },
                            { text: "Carpets" }
                        ] }
                    ]
                });

                $("#treeview-left").kendoTreeView({
                    dataSource: inlineDefault
                });
              
              
              //expandTo on its own works as expected
              function expandTo(){
                var treeView = $('#treeview-left').data('kendoTreeView');
                var node = treeView.findByText('Sofas');
                dataItem = treeView.dataItem(node);
                treeView.expandTo(dataItem);
              }
              
              //I want to close all the nodes and then expand the treeview to a specific node
              //but calling expandTo after calling collapse doesn't work
              function find(){
                var treeView = $('#treeview-left').data('kendoTreeView');
                treeView.collapse('.k-item');
                var node = treeView.findByText('Sofas');
                dataItem = treeView.dataItem(node);
                treeView.expandTo(dataItem);
              }
              
              //have to delay the expandTo call to make it work
              function findWithDelay(){
                var treeView = $('#treeview-left').data('kendoTreeView');
                treeView.collapse('.k-item');
                var node = treeView.findByText('Sofas');
                dataItem = treeView.dataItem(node);
                
                //delay the expandTo for half a second
                setTimeout(function(){treeView.expandTo(dataItem)}, 500);
              }
  </script>

            <style>
                #example {
                    text-align: center;
                }

                .demo-section {
                    display: inline-block;
                    vertical-align: top;
                    text-align: left;
                    margin: 0 2em;
                }
            </style>
        </div>
<body>
</body>
</html>

Hi

i'm new using kendo and i'm trying to use the markers in the map and I juts got the example from https://demos.telerik.com/kendo-ui/map/remote-markers (copy) and put it in my project and the markers don't show in the map. Using same datasource https://demos.telerik.com/kendo-ui/content/dataviz/map/store-locations.json What am I missing?

Hi all!

I've an unexpected behavior with ComboBox in case MVVM usage

The issue exists for the case when I have preselected data.SelectedFolder value - see below

shtml code (template for 'Edit' popup window, I've deleted extra text fields from the template):

js code - popup dialog

js code - model

When popup window opened -> Folder preselected -> this is expected, ok

But a user can't clear this selection using embedded 'clear' cross into ComboBox area.

Any thoughts or suggestions would be useful.

Thanks.

Grid scrolling works extremely slow in case of using it with virtualization and sorting. 

Link to reproduce an issue: https://dojo.telerik.com/@WA_PMak/IzevIzaV

Steps to reproduce:

1. Follow the link  https://dojo.telerik.com/@WA_PMak/IzevIzaV
2. Push the Run button
3. Sort by any column (for example by First Name)
4. Scroll grid till it loaded next virtual page
   
   
   Actual result: grid freezes during scrolling.
   Expected result: grid scrolling work fast as it do if it has unsorted data.