<div id="grid"></div>
<script>
// The dataSource is initialized as a stand-alone widget that can be bound to the Grid.
var dataSource = new kendo.data.DataSource({
transport: {
read: {
// The remote endpoint from which the data is retrieved.
url: "https://demos.telerik.com/kendo-ui/service/products",
dataType: "jsonp"
}
},
pageSize: 10
});
$("#grid").kendoGrid({
// The dataSource configuration is set to an existing DataSource instance.
dataSource: dataSource,
pageable: true
});
</script>
The breakpoint is added at the last line (326079) of the file.
The breakpoint is added at the desired line (e.g., 3715).
The Grid should allow switching between case sensitive and case insensitive filtering.
1. Create a solution with several Telerik UI for MVC projects
2. Perform a rename of a value that is present in multiple projects
Expected result: Rename is performed successfully.
Actual result: Visual Studio crashes.
Application: devenv.exe
In a Selectable grid, when only one column is shown in the grid, and the model's Id field is specified, an error occurs on selection.
If you include more than one column (must be more than one visible) it works correctly.
If the model's Id is not specified, it works correctly even with only one column visible.
@(Html.Kendo().Grid<TelerikMvcApp1.Models.OrderViewModel>()
.Name("grid1")
.Columns(columns => {
columns.Bound(p => p.ShipName);
columns.Bound(p => p.ShipCity).Hidden(true);
})
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.Selectable(s => s.Mode(GridSelectionMode.Single))
.HtmlAttributes(new { style = "height:430px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Read(read => read.Action("Orders_Read", "Grid"))
.Model(m => m.Id("OrderID"))
)
)
Row's hover effect should be optional and it could be enabled/disabled in grid's configuration, the same as we add Selectable, Navigatable, Sortable, Editable, etc., functionalities to grid. This could apply to odd/even coloring too. Should no need to do hacks to achieve this.
Of the highest priority, we desperately need file explorer for inserting and uploading images. In the AJAX editor, this appears to be build off the radFileExplorer control which is the other one we REALLY need for MVC which doesn't exist at all.
Hi,
We are using globalization with UI for ASP.NET MVC to translate control to French (fr-CA). However, while most messages are correctly displayed in French, there are some that are still displayed in English. For example, if we use the Grid control with filter on a 'string' column, the dropdown for the operators shows both French ("Commence par") and English ("Is empty") operators:
Looking at the source code, we can see that in ressource files "Messages.fr-FR.resx" and "Messages.fr-CA.resx", there are some messages that are still in English (for example, Filter_StringIsEmpty).
Note that corresponding text seems to be correctly translated in jQuery messages file (for example, "kendo.messages.fr-CA.js"), so it might only be a matter of applying the same translation to .resx files.
Note also that the same problem seems to be present in the source code of the latest version (2020.1.114).
Thanks!
Right now the Telerik UI MVC NuGet package is a 30 MB package that installs not just the DLL, but a lot of boilerplate JavaScript and CSS. I prefer to acquire the necessary content via Bower, so I can only install what I need. Currently, after every upgrade I have to wait for the package to install, then delete all of the unused content files. It would be nice if you supplied an "assembly-only" package, moving the content into an optional package that users who still need it could install. It would reduce upgrade time substantially, as well as offer less chance for a mistake.
After using setOptions() the HTML structure of Grids column header is different.
In the following demo:
https://demos.telerik.com/aspnet-mvc/grid/persist-state
When the button is clicked, setOptions() called for the Grid and the structure of the column headers is now different.
When setOpitons() is called with no options that may affect the headers the HTML structure of the column headers should be the same.
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;
}
Hi !
So I work with Kendo UI for JQuery and Kendo UI for ASP.NET MVC and recently I had to use your combobox and found that the search was not accent insensitive and that there were no options to make it so. I think it would be a wonderful feature to have. My dataSource contains a lot of names that could potentially have accents and it would be really great to includes thoses names when I filter without accent.
Thank you !
Currently, when you load a different Kendo theme on the page, the colors in the Charts and Gauges do not change and the components remain styled based on the originally loaded theme. In order for them to be styled by the new theme, the page must be reloaded.
It would be best, if the page reload can be avoided. For example, a method similar to the existing redraw() method could be implemented and it should be capable of detecting the currently loaded theme and redrawing the components accordingly.
Please note the following MVC code:
Bug 1: The Window should have the top set by the Top() method. It does not.
Bug 2: The Window should have the top set by the HtmlAttributes() method. That does not work either.
Bug 3: The scrollable method also does nothing to the window. So this entire line seems to be omitted.
Bug 4: The window is supposed to be centered by the Kendo native code. It isn’t. The recurring editor div element is not shown until after the window centers. So the window generates, centers on the screen, then the recurring DIV is shown which expands the window downwards, then the window is shown. This makes it go off the bottom of the screen. I didn’t need vertical center anyways so I fixed this by setting the top to 40px. Which is when I ran into the above issues. However if I was not doing this, the center() issue would still be there. I fixed this in JavaScript on the event’s edit event.
Test Environment:
OS Version: 22H2 OS Build 22621.1702
Edge Version: Edge(Chromium) Version 114.0.1823.37 (Official build) (64-bit)
Repro-Steps:
Test Environment:
OS Version: 22H2 OS Build 22621.1702
Edge Version: Edge(Chromium) Version 114.0.1823.37 (Official build) (64-bit)
Repro-Steps: