Bug report

Reproduction of the problem

Have a Grid bound to local data (see below code snippets and screenshot)

@model Pager_issue.Models.GridViewModel

@(Html.Kendo().Grid(Model.Items)
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.OrderID).Filterable(false);
        columns.Bound(p => p.Freight);
        columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}");
        columns.Bound(p => p.ShipName);
        columns.Bound(p => p.ShipCity);
    })
    .Pageable(p => p.PageSizes(new[] { "5", "10", "50", "all" }).PreviousNext(false))
    .Sortable()
    .Scrollable()
    .Filterable()
    .HtmlAttributes(new { style = "height:550px;" })
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .ServerOperation(false)
    )
)

    public class HomeController : Controller
    {
        [HttpGet]
        public ActionResult Index()
        {
            var model = new GridViewModel
            {
                Items = Enumerable.Range(0, 200).Select(i => new OrderViewModel
                {
                    OrderID = i,
                    Freight = i * 10,
                    OrderDate = DateTime.Now.AddDays(i),
                    ShipName = "ShipName " + i,
                    ShipCity = "ShipCity " + i
                })
            };

            return View(model);
        }

Current behavior

When filling the Grid with data via a ViewModel, the pager doesn't show on load

Expected/desired behavior

The pager should be visible on load

Environment

• Kendo UI version: 2023.2.829
• Browser: [all]

Bug report

Reproduction of the problem

Open a Signature Component demo and try to draw/sign fast on an Android device.

Current behavior

When signing fast on an Android device on the Signature component, making a signature from multiple parts by picking up the finger several times, the signature process freezes for a small period of time.
See attached videos where we tested on Android and IOS devices:

Android
IOS

Expected/desired behavior

Signing/drawing should be smooth

Environment

• Kendo UI version: 2023.2.829
• Browser: [Android Chrome]

My web page displays grids on multiple pages, and each grid has a pager with a page size control.

In recent updates the styling broke in all but one page.
In the case where I was creating the grid using Kendo UI for JQuery, it worked fine.
In the instances when I create it using MVC, there are styling errors. (See in the image how the number "10" is truncated.)




After much drilling into the HTML, I found the difference in how the Razor library creates the HTML elements, as opposed to how the JQuery creates the HTML elements.

JQuery generates the following element structure. Note that the k-pager-sizes element comes after the k-pager-numbers-wrap element

<div class="k-pager k-grid-pager k-pager-md"> <!-- The pager bar -->
     <div class="k-pager-numbers-wrap">
             <!-- ... -->
     </div>
     <span class="k-pager-sizes k-label">
            <!-- The page-size picker goes here -->
     </span>
</div>

In contrast, the Kendo Razor libraries generates the following element structure, where the k-pager-sizes element falls inside the k-pager-numbers-wrap element:

<div class="k-pager k-grid-pager k-pager-md"> <!-- The pager bar -->

     <div class="k-pager-numbers-wrap">
             <!-- ... -->
            <span class="k-pager-sizes k-label">
                  <!-- The page-size picker goes here -->
             </span>
     </div>

</div>

This breaks the styling. (I am using the bootstrap kendo theme) There is styling rule that imposes a minimum width on all buttons under .k-pager-numbers-wrap. This makes the drop-down arrow too wide, which causes the page size number to truncate.

    @each $size, $size-props in $kendo-pager-sizes {
        $_padding-x: k-map-get($size-props, padding-x);
        $_padding-y: k-map-get($size-props, padding-y);
        $_item-group-spacing: k-map-get($size-props, item-group-spacing);
        $_item-min-width: k-map-get($size-props, item-min-width);
        $_pager-dropdown-width: k-map-get($size-props, pager-dropdown-width);

        .k-pager-#{$size} {
            padding-inline: $_padding-x;
            padding-block: $_padding-y;
            gap: $_item-group-spacing;

            .k-pager-numbers-wrap {
                .k-button {
                    min-width: $_item-min-width;
                }

 My current hack workaround is to add a more specific CSS rule.

@import "@progress/kendo-theme-bootstrap/dist/all.scss";

.k-pager-md .k-pager-numbers-wrap .k-dropdownlist .k-button {
	min-width:inherit;
}

Bug report

Using the PDFViewer with the latest version of PDF.js (3.9.179) throws js exceptions. Version 3.4.120 is the last one, with which no js exception is thrown.

Reproduction of the problem

Dojo example: https://dojo.telerik.com/IHedIhur/3

1. Open the devtools consolve and run the example.

Current behavior

The file is loaded, however, js exceptions are thrown:

The --scale-factor CSS-variable must be set, to the same value as viewport.scale, either on the container-element itself or higher up in the DOM. text_layer.js:480:14

Expected/desired behavior

No js exceptions when using PDF.js versions newer than v3.4.120.

Environment

• Kendo UI version: 2023.2.718
• jQuery version: x.y
• Browser: [all]

Bug report

Reproduction of the problem

https://dojo.telerik.com/ORahihiZ/2

1. Edit a card

Current behavior

The second editor (NumericTextBox) in the popup is focused by default.

Expected/desired behavior

Since the form's focusFirst option is enabled, the first editor (textarea) in the popup should be focused by default.

As a workaround, the textarea can be focused in the editCard event handler:

function onEditCard(e) {
    setTimeout(function() {
        $(".k-taskboard-pane-content textarea").focus();
    }, 100)
}

Environment

• Kendo UI version: 2023.2.306
• jQuery version: x.y
• Browser: [all]

Bug report

When RadioButtonFor Helper is bound to a Model property it does not bind when an editable Grid is placed above its declaration.

Reproduction of the problem

1. Create a ViewModel that will be injected into the View:

   public class RadioButtonModel
   {
       public bool IAgreeProp { get; set; }
   }
   

2. Inject the model within the View:

    public class RadioButtonController : Controller
    {
       public ActionResult RadioButton()
       {
          RadioButtonModel myModel = new RadioButtonModel() { IAgreeProp = false };
          return View(myModel);
       }
     }
   

3. Initialize a RadioButtonFor Helper and place an editable Grid above its declaration:

         @(Html.Kendo().Grid<GridModel>()
                 .Name("Collaborators")
                 ...
                 .Editable(editable => editable.Mode(GridEditMode.InCell))
          )
        ...
        @(Html.Kendo().RadioButtonFor(m => m.IAgreeProp).Label("I Agree").Value(true))
        @(Html.Kendo().RadioButtonFor(m => m.IAgreeProp).Label("I Disagree").Value(false))
   

Current behavior

The RadioButtonFor Helper should bind to the specified Model property successfully.

Expected/desired behavior

The RadioButton Helper does not bind to the specified Model property successfully.

Environment

• Telerik UI for ASP.NET MVC version: 2023.2.606
• Browser: [all]

Bug report

When a UI for ASP.NET MVC Grid contains a PDF or Excel button within the Toolbar, the IconClass is being ignored.

Reproduction of the problem

.ToolBar(t => t.Excel().Text("Export to Excel").IconClass("icon here"))

Current behavior

Expected/desired behavior

The specific icon should be added based on the IconClass.

Environment

• Kendo UI version: 2023.2.606
• jQuery version: All Supported Versions
• Browser: All

Bug report

Regression introduced with 2023.3.606

DateTimePicker shows NaN when componentType is set to "modern" and a Date with intervals is passed to the min() method.

Reproduction of the problem

1. Open the following dojo.
2. In the first picker change the time to 4:30 PM.
3. In the second picker change the time to 4:00 PM.
4. Change again the time in the second picker to 5:00 PM.

Current behavior

The picker shows NaN/NaN/0NaN 12:NaN PM when the min option is set programmatically and the time is changed with intervals.

Expected/desired behavior

The picker should display the selected time and date after the min option is set programmatically.

Environment

• Kendo UI version: 2023.2.606
• Browser: [all]

Bug report

Reproduction of the problem

Dojo: https://dojo.telerik.com/oQeDIxUv

1. Inspect the selected tag of the MultiSelect. It has the k-disabled class.
2. Click the anchor above the component to enable it.

Current behavior

After the component is enabled, the k-disabled class remains in the tag.

Expected/desired behavior

The k-disabled class is removed.

Environment

• Kendo UI version: 2023.1.425
• jQuery version: x.y
• Browser: [all]

Bug report

The attributes handler overload does not get executed when the column is initially marked as hidden.

Reproduction of the problem

1. Open the following dojo.
2. Change the hidden property of the ContactTitle field to true.

Current behavior

The attributes handler is not executed when the column is hidden.

Expected/desired behavior

The attributes handler should be executed when the column is hidden.

Environment

• Kendo UI version: 2023.1.425
• Browser: [all]

Bug report

Reproduction of the problem

Dojo example: https://dojo.telerik.com/uGitesaF

Current behavior

When the DropDownList has an initial value, the floating label overlaps with the text.

Expected/desired behavior

The label should be displayed above the DropDownList.

Workaround: refresh the floating label in the dataBound event handler of the component:

e.sender.label.floatingLabel.refresh()

Environment

• Kendo UI version: 2023.1.314
• jQuery version: x.y
• Browser: [all]

Bug report

When the scrollable option is disabled, on resizing the browser window by making it more narrow, at certain point the columns stop resizing and the whole table goes out of the right border of the Grid. Reproducible with the SASS and LESS themes.

Reproduction of the problem

Dojo example: https://dojo.telerik.com/ItIrEzEY/3

1. Either resize the right pane or use Fullscreen and resize the browser window and make it narrower.

Current behavior

The table goes out of wrapping element (.k-grid).

Expected/desired behavior

The columns resize and the table remains within the borders of the Grid.

Environment

• Kendo UI version: 2023.1.117
• jQuery version: x.y
• Browser: [all]

Bug report

Reproduction of the problem

Dojo example: https://dojo.telerik.com/UWicoqeJ

1. Focus an empty cell and paste the following formula: =IF(AND(H4-I4>=B4, H4+I4<=C4), "OK", "NO OK")

Current behavior

The cell will display: "NO OK"

Expected/desired behavior

The cell should display: "OK" as it does in Excel.

Environment

• Kendo UI version: 2022.3.1109
• jQuery version: x.y
• Browser: [all]

Bug report

Dragging a row from a Grid to another empty Grid is not working.

Reproduction of the problem

1. Open the following dojo:
   https://dojo.telerik.com/EGIyemen
2. Try to drag a row to the empty Grid

Current behavior

The row is not inserted in the empty Grid

Expected/desired behavior

The row should be inserted in the empty Grid.

Environment

• Kendo UI version: 2022.3.1109
• Browser: [all]

Bug report

1. Open the following demo on a mobile device in landscape mode:
   https://demos.telerik.com/kendo-ui/signature/index
2. Try to draw.

Current behavior

Drawing line is being offsetted.

Expected/desired behavior

Drawing line should be applied correctly.

The issue might be related to #7108

Environment

• Kendo UI version: 2022.3.1109
• Browser: [all]

Bug report

Reproduction of the problem

Dojo example: https://dojo.telerik.com/oDOcanIk

1. Drag tile A and drop it after tile B

Current behavior

The checked radio button of the RadioGroup appears unchecked.

Expected/desired behavior

The RadioGroup check state remains the same.

Environment

• Kendo UI version: 2022.2.802
• jQuery version: x.y
• Browser: [all]

Describe the bug
Scenario: a Window appended to the content of a TabStrip tab. If the content is scrolled down, when you open the Window it does not appear centered. Reproducible only with the SASS themes.

To reproduce
Steps to reproduce the behavior:

1. Go to this dojo example: https://dojo.telerik.com/unopUDaQ/7
2. Follow the instructions in tab 1: scroll down to the bottom of the tab's content and click the button.
3. The Window shows up, but it is not centered. In Chrome the tab's content is automatically scrolled up a little bit.
4. On dragging the Window, the mouse cursor is offset from the title.

Expected behavior
The behavior with the LESS themes is the expected one. The Window appears centered and there is no offset when dragging it.

Affected package (please remove the unneeded items)

• theme-default
• theme-bootstrap
• theme-material

Affected suites (please remove the unneeded items)

• Kendo UI for jQuery

Affected browsers (please remove the unneeded items)

• All

Build system information (please remove the unneeded items)

• Not Applicable

Bug report

When the Grid AutoBind() configuration is set to false, the Grid is rendering an empty cell in the row element with class .k-no-data. (Image.png)

Reproduction of the problem

Set AutoBind configuration of Telerik UI for Asp.Net MVC Grid to 'false'. The Grid is rendered correctly except for the empty row and the empty cell in the table body.

Current behavior

An empty row with one empty cell is rendered.

Expected/desired behavior

The tbody element should be empty.

Environment

• Kendo UI version: 2022.2.621
• Browser: [all]

Creating a Telerik project for the "Standard" option is broken (VB.NET and C#):

1. The project fails building due to this error:

2. The rendered hamburger menu does not appear properly:

Bug report

If a RadioGroup is used for editing a required field, the validator is fired if a selection is not made. However, when selecting a field after the validation message appears and blurring the field, the other inputs of the RadioGroup remain marked as invalid.

Reproduction of the problem

Open the dojo:
https://dojo.telerik.com/eSEliROr/3

1. Try to submit the form.
2. The validation is triggered since the form is invalid, which is correct.
3. Select Name and click anywhere on the page.
4. The other options are still recolored as invalid

Expected/desired behavior

When an option is selected and the input is no longer focused, the validation message should disappear. Also, the other inputs should no longer be marked as invalid.

Environment

• Kendo UI version: 2022.2.621
• Browser: [all]