Hi Team,
We've noticed a problem where the "Items per page" section of the grid doesn't load at first. As observed below.
After the screen is zoomed out, it is visible.
Explanation of scenario-
Screen is in default zoom 100% - Not visible, once zoomed out to any value below 100% say 90 - Visible
Screen loaded in 90% - Not visible, Once zoomed out below 90 - Visible
Hello,
in our grid we have a ForeignKey-column to show the Text of a dropodown instead of the Value (see discussion here: https://www.telerik.com/forums/telerik-mvc-grid---show-selectlistitem-text-instead-of-value):
columns.ForeignKey(c => c.STATUS, Helper.IDTB_PRUEFUNG.Dropdowns.Status, "Value", "Text");This is the corresponding dropdown:
public class Dropdowns
{
public static List<SelectListItem> Status
{
get
{
return new List<SelectListItem>()
{
new SelectListItem()
{
Text = "New",
Value = "NEU",
Selected = true
},
new SelectListItem()
{
Text = "Locked",
Value = "GESPERRT"
}
};
}
}
}The Read-Action on the server is fairly simple:
[AcceptVerbs(HttpVerbs.Post)]
public JsonResult Read([DataSourceRequest] DataSourceRequest request, int lot_id)
{
var pruefungen = db.IDTB_PRÜFUNG.Where(p => p.LOT_ID == lot_id);
return Json(pruefungen.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}Now when we sort this column, the sorting is applied on the Value. I assume this is because the sorting is done on the database level? (We use Entity Framework here.)
Is there a way to have the sorting applied on the Text instead of the Value?
(I am aware that this is asking for a bit of magic here, since the database only knows about the Value and knows nothing about the Text. So I would even be happy for some hints in the a general direction to solving this (maybe client-side sorting, or sth. else). :) )

column.Bound(x => x.ReportUrl).ClientTemplate("<a href='#= ReportUrl #' target='_blank'>#= ReportUrl #</a>").Width(100);
Can I use a ClientTemplate to invoke a method from my controller when I click on the record in grid?
Maybe there is some examples?

I have PanelBar called Interest Rates and 3 children. I want the parent and all the 3 children cursor to pointer when hover the mouse.
Interest Rates
Default Rates
Negative Carry
Cash FTP
Thanks,
Abdul Ashad

We want to use the DatePicker like this:
<div class="row">
<div class="col">
<div class="form-group">
@Html.LabelFor(model => model.TESTDATUM, htmlAttributes: new { @class = "control-label" })
<div>
@Html.Kendo().DatePickerFor(model => model.TESTDATUM)
@Html.ValidationMessageFor(model => model.TESTDATUM, "", new { @class = "text-danger" })
</div>
</div>
</div>
</div>But this renders the control like this:
We're currently using the following workaround to trim the overlapping part, which feels kind of 'hacky':
<div style="width: 17.5em">
@Html.Kendo().DatePickerFor(model => model.TESTDATUM)
</div>
How to make the Kendo Panel Bar children as right indented.
For example I have PanelBar called Interest Rates and 3 children. I want the 3 children as below right indented.
Interest Rates
Default Rates
Negative Carry
Cash FTP
Thanks
Abdul Ashad
Hello,
we have some dropdown fields (List<SelectListItem>) for which we would like to show the SelectListItem-Text (instead of Value) in the grid.
The grid is NOT in edit mode.
The column renders as 'undefined':
(Info: if we switch to edit-mode in the grid, the dropdown is working correctly, it's just the display of the Text in the cell that's not working.)
How do we need to configure this?
This ist the List<SelectListItem>:
public class Dropdowns
{
public static List<SelectListItem> Status
{
get
{
return new List<SelectListItem>()
{
new SelectListItem()
{
Text = Resource.ACTIVE,
Value = "Aktiv"
},
new SelectListItem()
{
Text = Resource.DELETED,
Value = "Gelöscht"
},
new SelectListItem()
{
Text = Resource.EXPIRED,
Value = "Ausgelaufen"
}
};
}
}
}This is the field in the model:
[Required]
[UIHint("STATUSEditor")]
[Display(Name = "STATUS", ResourceType = typeof(Resource))]
public string STATUS { get; set; }This is the editor template:
@using Kendo.Mvc.UI
@model Models.IDTB_CHARGE
@(
Html.Kendo().DropDownListFor(m => m.STATUS)
.Name("STATUS")
.DataValueField("Value")
.DataTextField("Text")
.ValuePrimitive(true)
.BindTo(Areas.Chargen.Helper.Dropdowns.Status)
)This is the column in the grid:
columns.Bound(c => c.STATUS).ClientTemplate("#=STATUS.Text#").Width(130);
This is the situation: In have a grid, that is set up with server side paging, sorting and filtering. One of the columns displays the name of a related object. It should be possible to filter this column. Besides the name of the related object also an id is known (but not shown).
The filter should be with a dropdown list, presenting the possible choices to the user.
Currently the filter is set up as follows:
@(Html.Kendo().Grid<ReportEOSViewModel>()
.Name("EOSreports")
.Filterable(cfg => cfg.Extra(false))
.Columns(columns =>
{
columns.Bound(p => p.Well.WellNumber).Filterable(flt => flt.UI("reos_well_filter")
.Operators(op => op.ForString(fs => fs.Clear().IsEqualTo("Is equal to")))
.Multi(false).Extra(false));
// More columns...
})
.Pageable()
.Events(e => e.Filter("reos_filter"))
.Scrollable()
.DataSource(ds => ds
.Ajax()
.Batch(true)
.PageSize(50)
.Read(rd => rd.Action("GetList", "ReportEOS", new { id = Model }))
)
)With the supporting script:
function reos_well_filter(element) {
element.kendoDropDownList({
dataSource: {
transport: {
read: "@Url.Action("DropDownList", "Well")"
}
},
autoWidth: true,
dataTextField: "Value",
dataValueField: "Id",
optionLabel: "--select well--",
filter: "startswith"
});
}
function reos_filter(e) {
if (e.field === "Well.WellNumber") {
let flt = this.dataSource.filter();
if (flt !== undefined && flt !== null) {
for (let i = flt.filters.length - 1; i >= 0; i--) {
if (flt.filters[i].field === "WellRefFK")
flt.filters.splice(i, 1)
}
}
if (e.filter !== null) {
e.filter.filters[0].field = "WellRefFK";
}
else {
this.dataSource.filter(flt);
e.preventDefault();
}
}
}So basically the column has a .UI() call set up to reos_well_filter() that creates the drop down list, showing the names and returning the id as filter value. Also in the Filter event, there is special processing being done in case this particular column is being filtered on. Basically the name of the field in the filter is changed from "Well.WellNumber" to "WellRefFK". This, however, has some unwanted side effects, because the grid now basically doesn't recognize the filter as a filter for that specific column any more.
For starters, when filtering on a second item, the filter is not replaced, but added to. That's why the old filter is first removed. Also the clear filter function does not work any more, so that's why the case where e.filter === null is also processed. The last side effect that I noticed and have not been able to solve is that the filter button in the header does not show the column is being filtered on.
So my question is: Is there another way to let the grid know that the filter should be triggered on another field, so that everything keeps working as intended?
Bonus: Is it possible to hide the filter variant dropdown box, as there is only one choice now ("Is equal to").