Hi Guys,

Just upgrade to the 2025.1.211 release and during testing I have spotted a fundamental issue which should have been picked up during QA.

Run the following dojo

    https://dojo.telerik.com/dBSXoLYq

Open up the filter menu on the date column and hit the icon and you will find the date pop-up is constrained within the filter menu and cannot be navigated.
See attached screenshot - DateFilter.png

Note: This also effects filtering Date Time columns as well

Is there a workaround for this or do we have to wait another couple of months for the next release because as things stand we cannot pushed this to production.

Regards
Alan.

Would like to request that the ability to set a 'CenterTemplate' be added to the Radial and Linear Gauge charts. We show a percentage based label using jquery by appending to the chart wrap a label to show 'x of y (z%)'. What we've seen is that when you go to export the chart, this label doesn't follow with it.

When using other charting types, for example the Arc Gauge or Circular Gauge, they do have a property called 'CenterTemplate' which allows us to do labels like above and have it export correctly.

Can the property be added to other Charts so that we can customize a label to show information such as percentage based text?

See demo page: https://docs.telerik.com/kendo-ui/api/javascript/ui/colorpicker/configuration/clearbutton

The example uses "<input id="colorpicker" type="color" />".  Opening the preview reveals a black color.
Change the input-tag to div and the 'clear'-style is presented in the preview.
Or remove the color type when using the input-tag: "<input id="colorpicker" />" also correctly represents clear.

I can also locally reproduce it with Kendo UI jQuery v2024.4.1112.

When using a grid against a large table with server side filtering (ToDataSourceResult)

ToDataSourceResult builds a SQL query that converts the search string to UPPER() and therefore prevents the database from using its indexes. As SQL comparison is case insensitive that LOWER() is unnecessary.  

As we have may grids where this is an issue it would be time consuming to build out manual filters for each grid instead of using ToDataSourceResult

This was discussed here and there was no solution at the time:

https://www.telerik.com/forums/grid-filtering-on-text-using-lower-in-sql

I would liek to request an option to tell ToDataSourceResult() not to use LOWER() in the sql?

See ticket #1339310

Requesting a modification to any component that uses k-animation-container.

Some components have this capability:

popup: {
    appendTo: $("SOME ID")
}

This gives us the ability to modify CSS for a single/particular popup. Please add this ability to all relevant components.

Or any other method to modify the styling of a particular dropdown. In some cases, there's an ID that's added but is removed for some reason when adding a certain configuration.

Line Chart Crosshair doesn't display on Tablets.

Display's fine on Desktop & also on Mobile, but tested on iPad and Android tablets the Crosshair line does not display.

kendo.2020.1.114

Bug report
Line Chart Crosshair doesn't display on iPad iOS 17

Reproduction of the problem
Dojo: https://dojo.telerik.com/mGtuUvac

Expected/desired behavior
Crosshair shall display on tap

Environment
Browser: [all]

Kendo UI supports PDF export. It would be great if you could add glyph mirroring support to it as well (https://github.com/mozilla/pdf.js/blob/master/src/core/bidi.js). PDF export of RTL languages such as Arabic and Persian need this trick to work properly.

Hello,

We're interested  in a date input wheel (see attached images) as it is a feature that is especially for useful for mobile users. Telerik's technical support directed us here since the date widget doesn't offer this feature currently.

Kind regards

https://dojo.telerik.com/yBSdUQYS demonstrates the issue:

When a grid detail row is expanded, and pushUpdate() is called on it, the row collapses.

What is expected is for the grid row to remain in its prior state (expanded or collapsed.)

Until this is fixed, is there a work-around, other than manually re-expanding the detail row(s)? This is not a feasible work-around in which multiple nested grid rows are collapses and re-expanded, as this causes the UI to jump unexpectedly for the user.

There is an issue with the .k-sorted class being applied to the last column in the grid when the actual column is not visible. It also is not updating the k-sorted when a sort is applied after the grid was created. 

This seems to be an issue in the latest release if the column sorted on is hidden, the last column in the grid gets the class. I also noticed that sorting a column does not apply the k-sorted class to the correct column: https://dojo.telerik.com/@dojolee/eFIbaSUn 

var chart = $("#chart").data("kendoChart");
var series = [];

$(theData.Serieses).each(function (index) {
	series.push({
		name: theData.Serieses[index].Name,
		field: theData.Serieses[index].Name,
		data: theData.Serieses[index].SeriesPoints,
		xField: "X",
		yField: "Y",
		color: theData.Serieses[index].Colour,
		markers: {
			type: theData.Serieses[index].Shape
		}
	});
});
chart.setOptions({ series: series, noData: series.length == 0 });
chart.redraw();
console.log(chart.options);

When updating a chart after instantiation, because noData defaults to true, the overlay is shown immediately

if you try and set noData via setOptions then redraw(), the overlay is still in place

Honestly, this should have been marked as a breaking change as every single chart has to be updated to force noData to false just to show initially

Hello,

My use case:

On grid dataBound, I am iterating over the table rows to perform some piece of custom logic on the row based off of the backing dataItem. Our production site is using version 2024.1.130, and everything is working great. Our next release we've updated to version 2024.2.514, and when we try adding a record, we get an error; when we try to access the dataItem of the last table-row - the dataItem is undefined. The grid.items() in my case is an array of size 21, and the internal _data array is size 20.

Repro conditions (as far as I can tell):

• A Grid backed by a DataSource with server operations set to false
• The DataSource should (?) have a filter configured
• The size of the DataSource's data should (?) be larger than the pageSize

My workaround:

Simply perform a null check on the dataItem before doing the logic. We are calling DataSource.read in the DataSource.sync success callback anyway, so the grid will reload and the dataBound event will be handled afresh.

I've created the below dojo snippet to demonstrate a simplified version of my use case. I tested with 2024.1.130 and seems to work fine. I noticed the issue starting at version 2024.1.319.

https://dojo.telerik.com/INbSBrSg

A note: No, I don't actually use the internal _data property in my code, just for debugging purposes :)

Thanks!

-Alexa

Original ticket: 

START

As title says, when a list box is both draggable and multiple select is enabled the behavior is unpredictable. Sometimes when you click and drag on an item it will create the selection box when you are trying to simply drag the item, and other times the opposite. As far as I can tell there is no way to force one behavior or another.

$("#pdfPreviewList").kendoListBox({
            draggable: true,
            connectWith: "proposal",
            selectable: "multiple",
            dropSources: ["proposal"],
            template: `
                    <div id='#:file#'>
                        #:pn#
                    </div>`,
            toolbar: {
                tools: ["moveUp", "moveDown", "transferTo"]
            },
            change: (e) => {
                let f = e.sender.select()[0].getElementsByTagName("div")[0].id;
                displayPdfPrview(f)
            }
        });

Data source is 2 -3 items, so there is white space below the list items. 

END

I think there should be a dragToSelect option like there is in grid. That way you can still have multiple select work with key modifiers like control and shift and can also have dragging without worrying about the box select interfering with it.

maybe something like

select: "multiple" // normal selection *without* box selection
select: "dragToSelect" // selection with box selection and all the other features of "multiple" such as key modifiers

Also potentially a warning if dragToSelect and draggable are active at the same time to notify the developer that this combination may lead to unexpected behavior.

Thank you

Expose a Cron-Like Scheduler following an example found here https://crontab.guru/.

I'm seeing an error in the Chrome console when the filter menu is clicked on in a kendo grid: https://demos.telerik.com/kendo-ui/grid/filter-menu-customization

You can see the example in the link above by opening your console in Chrome and clicking on the filter button. 

Here is the error:

Blocked aria-hidden on a <a> element because the element that just received focus must not be hidden from assistive technology users. Avoid using aria-hidden on a focused element or its ancestor. Consider using the inert attribute instead, which will also prevent focus. For more details, see the aria-hidden section of the WAI-ARIA specification at https://w3c.github.io/aria/#aria-hidden.

When the browser is zoomed, the TabStrip scroll right arrow does not change to disabled when there are no more tabs to scroll into view. 

It looks like the problem is in kendo.tabstrip.js _toggleScrollButtons function, the following line:

that._scrollNextButton.toggleClass('k-disabled', scrollLeft === ul[0].scrollWidth - ul[0].offsetWidth);

When the browser is zoomed, kendo.scrollLeft(ul) returns a decimal value.  https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft has the warning: "On systems using display scaling, scrollLeft may give you a decimal value."

scrollWidth and offsetWidth are rounded to integer.

My workaround is to override the _toggleScrollButtons function and do the following:

that._scrollNextButton.toggleClass('k-disabled', Math.abs(scrollLeft - (ul[0].scrollWidth - ul[0].offsetWidth)) <= 1);