Hi,
wie have a Model A which is related to Model B (1:n). Both have a field of type DateTime with the DisplayFormat-Annotation '[DisplayFormat(DataFormatString = "{0:d}")]'.
If we display both fields in the Details-View of Model A, the formats are applied correctly.
If we display bot fields in a Telerik-GridView, only the format for Model A is applied. Model B shows something like '/Date(1741302000000)/'.
It's important to note, that our application is multilanguage, and we have to support different data formats for each language.
How would we go about this? Is this known behaviour?
Attempting to create persistence on filter.
I have the following filter:
@(Html.Kendo().Filter<...>()
.Name("fltMatrix")
.Events(e => e.Change("fltMatrix_Change"))
.DataSource("dataSource1")
.ExpressionPreview()
.Fields(f =>
{
...
}))
@Html.HiddenFor(model => model.FILTER)
I have the following JS code:
function fltMatrix_Change(e) {
e.sender.applyFilter();
$("#FILTER").val(JSON.stringify(e.expression));
}
function getInitialExpression() {
if ($("#FILTER").val()) {
return JSON.parse($("#FILTER").val());
}
}
document.ready looks like this:
$(document).ready(function () {
if (getInitialExpression()) {
var filter = $("#fltMatrix").data("kendoFilter");
console.log(filter);
var options = filter.getOptions();
options.expression = getInitialExpression();
filter.setOptions(options);
filter.applyFilter();
}
});
console shows undefined and I get an error on the highlighted line:
jQuery.Deferred exception: Cannot read properties of undefined (reading 'getOptions') TypeError: Cannot read properties of undefined (reading 'getOptions')
Everything else seems to work OK. The filter is loading and updating the data source on change. The filter expression makes the round trip to the server and back. It is just the .data("kendoFilter") that comes back with nothing.
As the title states, I have a legacy monolith that must be revived.
I need a few features, especially on the grid, and decided to upgrade Telerik. After a bit of struggle, I managed to run the application but the Telerik controls are by default very small compared to before and the new Size property doesn't seem to be doing much:
Before:
Now:
As it can be seen, the grid shrunk. I do not have a lot of custom CSS on this site but the baseline theme was Start Bootstrap v2 (Start Bootstrap - SB Admin 2 Bootstrap Admin Theme (http://startbootstrap.com)). Not sure if the original theme can still be found.
I am using autoFitColumn function on a Telerik UI for MVC grid to show the content of all cells as per the below article.
https://docs.telerik.com/aspnet-mvc/knowledge-base/grid-autofit-all-columns-width
This works if the grid's display is not none. However, there are three tabs on the page, each containing a grid. Only the opened grid has correct column widths. Other grids have minimum column widths. This is unless the user manually opens each tab quickly during data load.
I tried using Telerik's TabStrip at first, but the grid always has minimum column widths when using autoFitColumns, even on the first tab. The goal was to put a Grid inside each tab of the TabStrip. Currently, I am using custom built tabs.
My current solution to this problem is to set the "hidden" style of each grid to:
position: absolute;
top: -9999px;
left: -9999px;
Is there a better solution?
Hi,
I updated kendo from version 2020 to 2024.1.319 and noticed that the Grid is not adding the `data-field` attribute to the <td> elements as before.
Is this an error?
As per document : ASP.NET MVC jQuery Support - Telerik UI for ASP.NET MVC
It says the MVC 2023.1.117.0 support JQuery 3.6.1, but when i tried to use JQuery 3.6.1 on MVC Example demo , the page won't load the component.
Do i need to setting another thing to upgrade jquery ?
After upgrading Kendo MVC from v2021.2.616 to v2024.2.514 (KendoUIProfessional), the dropdownlist "SeriesType" on the grid is not firing the onChange event anymore. I saw an error message in the browser console.
Can you guys suggest a migration solution for it? Thanks!
Browser console error:
cshtml
@(Html.Kendo().Grid<MySeriesModel>().Name("drpSeries")
.Columns(column =>
{
column.Bound(model => model.SeriesName).HtmlAttributes(new { style = "font-weight: bold" }).Title("No.").Width(40);
column.ForeignKey(c => c.SeriesType, (IEnumerable<SelectListItem>)ViewBag.LstSeriesType, "value", "text").HtmlAttributes(new { style = "text-align: left", onChange = "onChangeSeriesType('#=ID#'); setSerieXml();" }).Title("Series Type").MinScreenWidth(60);
column.Bound(model => model.SeriesTitle).Title("Series Title").HtmlAttributes(new { onChange = "setSerieXml();" }).MinScreenWidth(120).Encoded(false);
column.Bound(model => model.Axis).Title("Axis").ClientTemplate("#=getAxisActionLink(ID,Axis)#").MinScreenWidth(120);
column.ForeignKey(c => c.Y_Format, (IEnumerable<SelectListItem>)ViewBag.LstSeriesFormat, "value", "text").HtmlAttributes(new { style = "text-align: left", onChange = "onChangeFormat(this);" }).Title("Format").MinScreenWidth(150);
column.ForeignKey(c => c.Y_Axis, (IEnumerable<SelectListItem>)ViewBag.ListSerriesYAxis, "value", "text").HtmlAttributes(new { style = "text-align: left", onChange = "onChangeYAxis(this,'#=ID#');" }).Title("Y Axis Scale").Width(100);
column.Bound(x => x.ID).ClientTemplate("<button class= 'k-button' type='button' onclick=onRemoveSeries('#=ID#')>" + "Remove" + "</button>").HtmlAttributes(new { style = "text-align: center" }).Title("").Width(120);
})
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.Model(model =>
{
model.Id(item => item.ID);
model.Field(item => item.ID).Editable(false);
model.Field(item => item.SeriesName).Editable(false);
model.Field(item => item.Axis).Editable(false);
model.Field(item => item.SeriesTitle).Editable(false);
})
.Read(read => read.Action("SeriesList_DataSource", "Dashboard").Data("getDataForDgdSeries_Read"))
)
.Events(e =>
{
e.DataBound("onDataBoundDgdSeries");
})
.Resizable(x => x.Columns(true))
.AutoBind(true)
.Scrollable(x => x.Enabled(true))
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Selectable(selectable => selectable.Mode(GridSelectionMode.Single))
.HtmlAttributes(new { style = "overflow: auto; width:100%", @class = "form-group" })
)
JS
function onChangeSeriesType(id) {
drpSeries = $('#drpSeries').data('kendoGrid');
dataSource = drpSeries.dataSource;
var lstSerieRow = dataSource.data();
if (lstSerieRow[id - 1].Axis.length > 0) {
lstSerieRow[id - 1].SeriesTitle = "";
lstSerieRow[id - 1].Axis = "";
dataSource.fetch();
}
}
Model
public class MySeriesModel
{
public string ID { get; set; }
public string SeriesName { get; set; }
public string AxisName { get; set; }
public string Axis { get; set; }
[AllowHtml]
[UIHint("GridDropDownList")]
public string SeriesType { get; set; }
public string SeriesTitle { get; set; }
public string X_Ordinate { get; set; }
public string X_Format { get; set; }
[AllowHtml]
[UIHint("GridDropDownList")]
public string Y_Format { get; set; }
[AllowHtml]
[UIHint("GridDropDownList")]
public string Y_Ordinate { get; set; }
[AllowHtml]
[UIHint("GridDropDownList")]
public string Y_OrdinateTo { get; set; }
public string TOOLTIP_FORMAT { get; set; }
[AllowHtml]
[UIHint("GridDropDownList")]
public string Y_Axis { get; set; }
}
controller
public ActionResult RenderSeriesConfig(string viewName)
{
List<SelectListItem> seriesType = GetDashboadChartStyleTypeList();
string arrSeriesType = "";
for (int i = 0; i < seriesType.Count; i++)
{
arrSeriesType += seriesType[i].Text.ToString() + "," + seriesType[i].Value.ToString() + ";";
}
ViewBag.LstSeriesType = seriesType;
ViewBag.ArrSeriesType = arrSeriesType;
ViewBag.LstSeriesAxis_Ordinate = GetLstFieldNamesSelectListItem(viewName);
ViewBag.LstSeriesFormat = GetFormatShortList();
ViewBag.ListSerriesYAxis = GetYAxisSettingList();
return PartialView("_ChartDetail_Series");
}
Asp.net mvc kendo rating control shwoing 1 star by default even though value is zero
This code is integrated in kendo grid
below is the code
columns.Bound(p => p.Rating).Title("Rating").Editable("returnFalse")