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;
}
As the title says, I'm getting script errors when attempting to perform a delete function with an MVC grid when in MobileMode.Phone. The attached project will illustrate the problem. Just run it and select delete button for one of the items in the far right column. A popup will appear, but don't click either of the buttons on it yet. Inspect the html with whatever browser you use (I'm using chrome so I just right click and choose select). There will be a "Cannot read property 'data' of undefined" error. If you then click the "Delete" button, you'll get a "Cannot read property 'resolve' of undefined". Then click on the "Cancel" button and you'll get "Cannot read property 'reject' of undefined". I'll attach a pic showing these errors.
I need to be able to utilize my grid in mobile phone mode and delete items. Please help with this.
Also, to get this sample project small enough, I removed the files from the MobileSaveError\lib\KENDOUIMVC\2020.3.915.545 folder. I figure you can replace those easily enough. Is that the right thing to do in this case? I thought maybe I could remove the items in the Packages folder as NuGet/VS will usually restore those. But wasn't 100% sure on that. So if you can tell me or link me to an article about what we can remove to shrink the project size for samples when we need to send them, that would be great.
Thank you,
Steven
Hello telerik support,
recently we updated to 2023.2.718
somehow the grid column menu is not completely in german language
How can I apply german language to the complete column menu?
Best regards
Andy
Aligning numeric values in grids is common place and best practise. Kendo Grid does not provide any neat functionality for this, especially in MVC where the model is strongly typed. Where a MVC grid is bound to a model, the Razor Wrapper would work better if it right aligned columns if for example type int (or other numeric types which are better to be right aligned). Where this needs not to be the case a data annotation would suit.
eg.
public class MyModel
{
[AlignRight(false)]
public int ProductID {get; set;}
public int Age {get; set; } // aligned right by default in Kendo Grid because of int type
}
In the above case ProductID would be left aligned, and Age would be right (which could be the default for all integer types)
With this functionality the razor implementation could also provide an align property to override align functionality. An AutoAlign property could provide this functionalityto auto detect from model or not (and also allow this functionality as being off to provide backwards compatibility)
@(Html.Kendo().Grid<MyModel>()
.Name("grid")
.AutoAlign(false)
.Columns(columns =>
{
columns.Bound(c => c.ProductID).AlignRight(false)
columns.Bound(c => c.Age).AlignRight(True)
})
Hey,
I might have found another bug.
The "Change" Event isn't triggered for checkboxes if GroupPaging is set to true.
If it's disabled, the event gets caught as expected.
Html.Kendo().Grid<PlotWhitelistViewModel>()
.Name("whitelistGrid")
.Columns(c =>
{
c.Bound(x => x.Id).Hidden();
c.Select().Width(50);
c.Bound(x => x.ArticleNo);
})
.Events(x =>
{
x.Change("onWhitelistGridChange");
})
.Scrollable(s => s.Virtual(true))
.DataSource(dataSource => dataSource
.Ajax()
.Group(x => x.Add(y => y.ArticleGroup))
.GroupPaging(true)
.PageSize(50)
.Read("GridRead_Whitelist", "Plot", new {plotId = Model})
.Model(m =>
{
m.Id(f => f.Id);
m.Field(f => f.ArticleNo);
m.Field(f => f.ArticleGroup);
m.Field(f => f.IsChecked);
}))
Regards
Nils
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.
Hi Team,
I'd like to request adding aggregation to the Kendo UI Grid Custom Ajax Binding Live Demo.
Thank you!
Regression in R1 2023 SP1.
Set a HeaderTemplate in one of the following 3 ways.
columns.Bound(p => p.Freight).HeaderTemplate("<div title='Freight'>Freight</div>");
columns.Bound(p => p.Freight).HeaderTemplate(@<text>
<div title="Freight">Freight</div>
</text>);
columns.Bound(p => p.Freight).HeaderTemplate(@<div title="Freight">Freight</div>);
In the first scenario the error is:
System.NotSupportedException: Specified method is not supported.
In the second and third scenario the error is:
Index was out of range. Must be non-negative and less than the size of the collection.
Parameter name: index
No exception thrown when the HeaderTemplate is set.
I've been using the "Change" event to handle a Single Row Selection grid as that seems to be the event to use to determine when the user selects a row.
I just tried adding "persistSelection(true)" to my grid but it seems to be triggering a change event when I switch to another page and back to the previous page, or do an external $(this).data('kendoGrid').dataSource.read() on the grid.
How can I only get a change event when the USER selects a row, not the persistedSelection selecting the row?
Or at least detetect where it came from it in my Change event?
Thanks,
Bryan
Add a class to cells in a sorted column (similarly to the .k-sorted class in a sorted column's <th> element) to distinguish them from cells in unsorted columns.
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);
}
When filling the Grid with data via a ViewModel, the pager doesn't show on load
The pager should be visible on load
Using server binding does not render the NoRecords message for the Grid
@(Html.Kendo().Grid(new List<Product>())
.Name("Grid")
.Columns(columns => {
columns.Bound(p => p.ProductID).Groupable(false);
columns.Bound(p => p.ProductName);
columns.Bound(p => p.UnitPrice);
columns.Bound(p => p.UnitsInStock);
})
.NoRecords("No records found.")
.Pageable()
.Sortable()
.Scrollable()
.DataSource(d=>d.Server())
.Filterable()
.Groupable()
)
A possible workaround is to use local binding by setting the AJAX binding in the DataSource, but keep the initial server binding:
@(Html.Kendo().Grid(new List<Product>())
.Name("Grid")
.Columns(columns => {
columns.Bound(p => p.ProductID).Groupable(false);
columns.Bound(p => p.ProductName);
columns.Bound(p => p.UnitPrice);
columns.Bound(p => p.UnitsInStock);
})
.NoRecords("No records found.")
.Pageable()
.Sortable()
.Scrollable()
.DataSource(d=>d.Ajax().ServerOperation(false))
.Filterable()
.Groupable()
)
add a grid to a view
open the view with data bound to the grid.
First line of data is not selected.
Now i have to program the ondatabound property for a function which belongs to the grid component. Make it configurable for grids which do not need this feature or vice versa.