The NumericTextBox renders two input elements. In a Grid inline editing scenario: https://demos.telerik.com/aspnet-mvc/grid/editing-inline one of inputs of the NumericTextBox editor does not render a title and there is no label for the inputs. This causes an error for missing form element label in Html static analysis (Wave).
One way for this to be avoided could be using aria-labelledby attribute instead of title. The same aria-labelledby value will be assigned to both inputs pointing to a span or div that contains the input value. This way both inputs will have label and won't trigger the missing label error.
I would like to be able to create .bindBoolColumn. I do not want extend the column itself. I already have extensions for that.
Something like this:
GridBoundColumnBuilder<TModel> BoundBoolean<TValue>(Expression<Func<TModel, TValue>> expression)
public GridBoundColumnBuilder<TModel> BoundBool<TValue>(Expression<Func<TModel, TValue>> expression)
{
column = *place create column code here*;
column.Width(90);
column.clientTemplate("customtemplate");
}
Reproducible in:
https://demos.telerik.com/aspnet-mvc/grid/editing-inline
and
https://demos.telerik.com/aspnet-core/grid/editing-inline
The input does not have a title attribute or label.
The input should either have a title attribute, like in the Kendo UI for jQuery Grid, or since we use a TextBox component as editor in MVC and Core, a label should be rendered.
Currently the ForeignKey column expects data to be loaded in it initially. This could be either local data or remote data.
For scenarios that involve using large data, it would be helpful if we can have more flexibility with the way data is loaded in the column's editor (e.g., DropDownList). For example, we want to use cascading ForeignKey editors. Once a selection is made in the first dropdown, the second cascades and is loaded with the respective data. This is not viable at the moment, because the data must be supplied to the ForeignKey column initially. If an empty collection is passed initially:
columns.ForeignKey(c => c.Field1, new List<SelectListItem>(), "Value", "Text").Width(100);
and the dropdown is then loaded with data after the Grid's Edit popup opens, the ForeignKey column will display the DataFieldValue as text, because no initial data has been provided.
An option to load data on demand would be a welcome performance enhancement.
When .Navigatable() is enabled, the Grid renders an aria-describedby attribute in each td element. The value of the attribute should match the id value of the respective column header. This works for standard columns bound to fields in the data, but doesn't work for a selectable column:
columns.Select();
The selectable column header element (th) does not render an id. The td elements of that column render an aria-describedby attribute, the value of which does not match any element id. This causes an accessibility issue (Ticket ID: 1530928).
Reproducible with the MVC helper:
@(Html.Kendo().Grid<TelerikMvcApp1.Models.OrderViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Select();
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()
.Navigatable()
.Scrollable()
.HtmlAttributes(new { style = "height:550px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Read(read => read.Action("Orders_Read", "Grid"))
)
)
The selectable column header element (th) does not render an id.
The selectable column header element (th) renders an id that matches the aria-describedby attribute value of the td elements in the column.
https://demos.telerik.com/aspnet-mvc/grid/persist-state
The search panel disappears from the Grid's toolbar.
The search panel is present in the Grid's toolbar.
In the Kendo UI for jQuery Grid, fields that are not editable are displayed as text (no input elements) in the Grid's popup editor. The MVC Grid displays all fields that are present in the view model it is bound to in its popup editor.
Implement an option to configure the editable fields, so that the behavior of the MVC Grid matches that of its Kendo UI counterpart.
Implement an option to control the columns width in scenarios that involve resizing the browser window.
Currently, if you specify the width of all the columns, on resizing the browser window the columns automatically resize proportionally. A column property MaxWidth would be nice to have, since it would prevent columns from resizing beyond a specified width value.
Reported in: Ticket ID: 1524543. Reproducible in Chrome and Firefox. Not reproducible in Edge
Version 91.0.864.54.
Dojo example: https://dojo.telerik.com/iqUFarUV/3
On dragging the handle the column width automatically increases. Then if you try to decrease the width, you can't go past a certain width threshold.
The columns can be resized precisely, similarly to when their width is set in "px" instead of "%".
In the Less themes the textboxes and the other editors (e.g., NumericTextBox) in the popup of the Grid are misaligned. The rendering of the textboxes in the MVC and Core Grid is different when compared to the Kendo UI for jQuery Grid.
Reproducible in the Popup Editing demos (Core and MVC).
The width of the TextBox does not match the width of the NumericTextBox.
The rendering differs:
<span class="k-widget k-textbox k-valid" style=""><input data-val="true" data-val-required="The Product name field is required." id="ProductName" name="ProductName" value="" data-role="textbox" aria-disabled="false" class="k-input k-valid" autocomplete="off" data-bind="value:ProductName" style="width: 100%;"></span>
vs
<input type="text" id="ProductName" name="ProductName" title="Product Name" required="required" autocomplete="off" data-bind="value:ProductName" class="k-textbox k-valid">
Identical rendering and alignment.
Bug report
When the Kendo UI Grid is configured to have endless scrolling and an item is updated on the first page, the scrollbar is reset. If an update is done on a page after the first one, the scroll is correctly persisted.
Reproduction of the problem
1. Set a grid with an endless scroll.
2. Scroll down (without entering the second page).
3. Update an item on the first page.
4. The scroll is reset.
Dojo sample for reference:
https://dojo.telerik.com/EcUKIrAK
Environment
* **Kendo UI version:** 2021.1.330
* **jQuery version:** 1.12.4
* **Browser:** [all]
A recent update has revealed some strange behaviour in some (not all) grids. In the attached screenshot, the javascript for the two buttons is on display inside the toolbar. If I move them out of the toolbar, the script no longer displays.
As a workaround, I have added this to CSS:
script {
display: none !important;
}
Bug report
Error is thrown when using Kendo HTML Editor Control in Kendo Grid Popup EditorTemplate in IE only
Reproduction of the problem
Place Kendo editor in Grid popup template
@(Html.Kendo().Grid<TelerikMvcApp2.Models.Person>().Name("persons")
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(m => m.PersonID))
.Read(read => read.Action("GetPersons", "Home"))
.Update(up => up.Action("UpdatePerson", "Home"))
)
.Columns(columns =>
{
columns.Bound(c => c.PersonID).Width(200);
columns.Bound(c => c.Name);
columns.Bound(c => c.BirthDate).Format("{0:g}");
columns.Command(cmd => cmd.Edit());
})
.Pageable()
.Sortable()
.Editable(ed => ed.Mode(GridEditMode.PopUp).TemplateName("Person"))
)
Person.cshtml
@(Html.Kendo().EditorFor(model => model.Text))
1. Run and open in IE
2. Click edit, make a change in the popup and Save
2. Click again on Edit
https://www.screencast.com/t/kZFZ9hZNEp
Expected/desired behavior
No error is thrown
Environment
Kendo UI version: 2020.3.118
I use getOptions() and setOptions() to persist the state of the ajax bound grid that I have.
My toolbar is not a server one, it is this:
.ToolBar(toolbar =>toolbar.Create().HtmlAttributes(new { @class ="k-primary"}))
When I call the setOptions() method, it removes the Add button from the grid header.
Bug report
When there are 3 levels of filter nesting in the URL clearing of a filter does not apply
Reproduction of the problem
1. Go to https://demos.telerik.com/aspnet-mvc/grid/serverbinding
2. On “Product Name” column apply filter “Contains” with value “a”
3. On “Unit Price” column apply filter “Is greater than” with value “1”
4. On “Units In Stock” column apply filter “Is greater than” with value “1”
5. On “Product ID” column apply filter “Is greater than” with value “1”
6. Clear the filter on “Product Name” column
Expected result: no more filter on “Product Name” column
Actual result: “Product Name” column still has a filter
A workaround is provided in the following Dojo:
https://dojo.telerik.com/UJewihaX
Environment
Kendo UI version: all
Browser: all