Is there a way to conditionally show a tooltip? I want to be able to prevent showing the tooltip based on some arbitrary javascripting. I've tried to mess with the show event (return false / ev.preventDefault() / etc), but that doesnt seem to work. I've found a rather funky solution to this question on http://stackoverflow.com/questions/23297623/kendo-ui-conditionally-preventing-a-tooltip-from-being-displayed-on-a-grid-cell where a 'beforeShow' event is added to the tooltip show function. Any other options that I might have missed?

Regards,
Ron

HI 

     I have an issue in kendo combobox I added a tooltip in kendo combobox dropdown list, the issue is when I click the tooltip in the combobox the dropdown was automatically closed. I want the when the tooltip dialog opens then the corresponding combobox dropdown list should not close. I am stuck in this issue help me out.

I used both the e.Preventdefault and e.stoppropagating but its not working. The following code that I used for the tooltip click event and I attached the screenshot of my issue.

comboBox.list.find('.info-MultiComboBox', '.cogInfo', 'cog-widget').click(function (e) {
// For some reason, this click event causes the dropdown to close. Calling preventDefault() stops this behavior.
e.preventDefault();
});

The change event doesn't actual change when you change the value; it only fires when the control loses focus.

Even on the Telerik Demo, it only updates the log box when you click off of the control.

How do I make it fire when I am typing in the control itself?

One of our team members can reproduce this on his computer, but so far no one else can on theirs, and I'm wondering if it's something anyone has ever heard of?

Here's what he does:

1. Use either Firefox (v50.1.0) or IE 11 on Windows 7
2. Go to the Kendo UI editor demo page at http://demos.telerik.com/kendo-ui/editor/index
3. Click into the editor
4. Use the RIGHT Ctrl key + A to select all the content
5. Use one of the editor's formatting buttons, such as the "Center text" button.

For this person, the formatting is only applied to the content right next to where he positioned the cursor in Step 3, and not to all the selected text. It doesn't happen in Chrome, and it also doesn't happen if he uses the left Ctrl key. 

It also doesn't happen to anyone else on the team, even when we use the same version of Firefox and IE.

I have replicated this in the sample project attached.

Simply put, change events on the Kendo DatePicker control (created by the MVC wrapper), fire immediately upon loading the page, but do not fire when the date value of the control is changed.

Hi, 

i have created scheduler, which initialise and adding data source on button click.

so first time it is working properly, but second time when i click the same button it again create the new scheduler with same data source.

on page i can see the two scheduler with one with out data and other with data.

attaching the screenshot for the same.

here is button click code:

$.ajaxSetup({ cache: true});
$.getScript('js/jquery.min.js', function(data, textStatus, jqxhr) {
  $.getScript('js/kendo.all.min.js', function(data, textStatus, jqxhr) {
    $.getScript('js/kendo.timezones.min.js', function(data, textStatus, jqxhr) {
      $(document).ready(
        function () {
          $.ajax( {
            url: "http://"+host+"/MDMToolkit//api/MESLookup?ObjectName=MDM_Sched_Get_ScheduledJob&Command=GetByKey&filterParams="+
            JSON.stringify(ParamsArray),
            contentType: "application/jsonp; charset=utf-8",
            async:false,
            dataType: "json",
            success: function (records)
            {
              POdata = records;
            },
            error: function (err)
            {
              console.log('err:'+err.responseText);
            }
          });


          $('#schedulerS1').kendoScheduler({
            views: [
              "timeline"
            ],
            toolbar: ["pdf"],
            messages: {
              pdf: "PDF Export"
            },sync: function() {
              this.read();
            }, 
            resources: [
              {
                field: "oper_id",
                name: "Jobs",
                title: "Jobs",
                dataSource: []
              }
            ],
            majorTick: 120,
            minorTickCount: 1,
            columnWidth: 50,
            timezone:"Europe/London",
            group: {
              resources: ["Jobs"],
              orientation: "vertical"
            },
            save: appointment_save,

            editable: {

              create: false,
            },
            resizeEnd: function(e) {
              isResize = 1;
              startdate = new Date(e.event.start);
              enddate = new Date(e.event.end);
              console.log("startdate : "+startdate);
              console.log("enddate "+enddate);
            },

            footer: false,

            date: new Date(date),
            startTime: new Date(date)

          });

          var scheduler = $("#schedulerS1").data("kendoScheduler");
         
          var dataSource = new kendo.data.SchedulerDataSource({
            data: //Data Source
          });
          scheduler.setDataSource(dataSource);
 scheduler.resources[0].dataSource.add(//DATA)
      scheduler.view(scheduler.view().name);

          function dataSource_sync(e)
          {
            console.log("sync complete");

          }

          function appointment_save(e) (
          }
        });
    });
  });
});

The column menu is not getting sorted as claimed in the  Help URL (http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#configuration-columnMenu.messages.sortAscending)

I have attached screenshots of both the preview and the DOJO output the strings are not sorted as claimed. Is there a straight /roundabout fix for this??

hi,

we have a grid with batch edit and a check box in the column. this check box can be changed in the view mode also. while editing data is not updated in the UI and check box is also not working like not editable. we are using 2016 kendo with angularJs.

<!DOCTYPE html>
<html>
<head>
    <base href="http://demos.telerik.com/kendo-ui/grid/editing">
    <style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
    <title></title>
    <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.common-material.min.css" />
    <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.material.min.css" />
    <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.material.mobile.min.css" />

    <script src="//kendo.cdn.telerik.com/2016.3.1118/js/jquery.min.js"></script>
    <script src="//kendo.cdn.telerik.com/2016.3.1118/js/kendo.all.min.js"></script>
</head>
<body>
        <div id="example">
            <div id="grid"></div>

            <script>
                $(document).ready(function () {
                    var crudServiceBaseUrl = "//demos.telerik.com/kendo-ui/service",
                        dataSource = new kendo.data.DataSource({
                            transport: {
                                read:  {
                                    url: crudServiceBaseUrl + "/Products",
                                    dataType: "jsonp"
                                },
                                update: {
                                    url: crudServiceBaseUrl + "/Products/Update",
                                    dataType: "jsonp"
                                },
                                destroy: {
                                    url: crudServiceBaseUrl + "/Products/Destroy",
                                    dataType: "jsonp"
                                },
                                create: {
                                    url: crudServiceBaseUrl + "/Products/Create",
                                    dataType: "jsonp"
                                },
                                parameterMap: function(options, operation) {
                                    if (operation !== "read" && options.models) {
                                        return {models: kendo.stringify(options.models)};
                                    }
                                }
                            },
                            batch: true,
                            pageSize: 20,
                            schema: {
                                model: {
                                    id: "ProductID",
                                    fields: {
                                        ProductID: { editable: false, nullable: true },
                                        ProductName: { validation: { required: true } },
                                        UnitPrice: { type: "number", validation: { required: true, min: 1} },
                                        Discontinued: { type: "boolean" },
                                        UnitsInStock: { type: "number", validation: { min: 0, required: true } }
                                    }
                                }
                            }
                        });

                    $("#grid").kendoGrid({
                        dataSource: dataSource,
                        navigatable: true,
                        pageable: true,
                        height: 550,
                        toolbar: ["create", "save", "cancel"],
                        columns: [
                            "ProductName",
                            { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: 120 },
                            { field: "UnitsInStock", title: "Units In Stock", width: 120 },
                            { field: "Discontinued", width: 120 ,
                          template: '<input ng-model = "dataItem.Discontinued" id ="qw_#=ProductName#" type="checkbox" ng-change="getClick(dataItem)" class = "k-checkbox"></input><label for="qw_#=ProductName#" class="k-checkbox-label"></label>', editor: '<input ng-model = "dataItem.Discontinued" id ="qw_#=ProductName#" type="checkbox" ng-change="getClick(dataItem)" class = "k-checkbox"></input><label for="qw_#=ProductName#" class="k-checkbox-label"></label>'},
                            { command: "destroy", title: "&nbsp;", width: 150 }],
                        editable: true
                    });
                });
            </script>
        </div>


</body>
</html>

Hello,

when setting "modal" option to "true", page is covered with overlay and window is shown as the top most element on the page, but there's no modal-like behaviour as of a11y - user still can "escape the modal" using keyboard navigation. As Kendo is dealing with aria attributes already, would not it be possible to add this behaviour too?

Hi ,

Do we have an inbuilt option to create drowdown list through UI editor widgets?