Your online examples need explanation. Just putting the code out there is not considered best practice. This example:
https://demos.telerik.com/aspnet-mvc/combobox/cascadingcombobox
I'm trying to get the cascading going using ASP.NET Core MVC. I am able to get the first combo box working. But, the cascade action doesn't work. Your example references objects that have no definition so I'm lost. For example:
productFilter: $("#products").data("kendoComboBox").input.val()
What is the "kendoComboBox" referring to? What is it and where did it originate?
Here is my attempt:
<
div
class
=
"form-group"
>
<
label
asp-for
=
"DefaultCountryCode"
class
=
"control-label"
></
label
><
br
/>
@(Html.Kendo().ComboBoxFor(x => x.DefaultCountryCode)
.Placeholder("Select Country...")
.DataTextField("Name")
.DataValueField("Context")
.Filter(FilterType.Contains)
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetCountries", "Persons");
});
})
.HtmlAttributes(new { style = "width: 100%" }))
</
div
>
<
div
class
=
"form-group"
>
<
label
asp-for
=
"DefaultTimeZoneId"
class
=
"control-label"
></
label
><
br
/>
@(Html.Kendo().ComboBoxFor(x => x.DefaultTimeZoneId)
.Placeholder("Select Time Zone...")
.DataTextField("Comment")
.DataValueField("ZoneId")
.Filter(FilterType.Contains)
.DataSource(source =>
{
source.Read(read =>
{
read.Action(
"GetTimeZoneByCountryCodeAsync",
"Persons")
.Data("filterZones");
});
})
.HtmlAttributes(new { style = "width: 100%" })
.Enable(false)
.AutoBind(false)
.CascadeFromField("DefaultCountryCode")
)
<
script
>
function filterZones() {
return {
countries: $("#countries").val(),
productFilter: $("#timeZones").data("kendoComboBox").input.val()
};
}
</
script
>
</
div
>
The "DefaultCountryCode" combobox is working.
Your example seems to refer to the other combobox using the value in the "combobox.name" property. However, I tie this to the model using ComboBoxFor.
2nd ComboBox:
Thanks for your help,
Joel
Working with the Core grid I noticed that the excel export autowidth is not working for date columns. Every other column is working but not dates. Here is my function for the export...
function gridReport_ExcelExport(e) {
var sheet = e.workbook.sheets[0];
for (var rowIndex = 0; rowIndex <
sheet.rows.length
; rowIndex++) {
var
row
=
sheet
.rows[rowIndex];
var
expandRow
=
false
;
for (var
cellIndex
=
0
; cellIndex < row.cells.length; cellIndex++) {
var
cell
=
row
.cells[cellIndex];
if (rowIndex > 0)
cell.vAlign = "top";
if (cell.value && cell.value.toString().indexOf("<
br
/>") >= 0) {
cell.value = cell.value.replace("<
br
/>", "\n");
cell.wrap = true;
expandRow = true;
}
}
if (rowIndex > 0)
sheet.rows[rowIndex].height = 50;
}
for (var colIndex = 0; colIndex < sheet.columns.length; colIndex++) {
var column = sheet.columns[colIndex];
delete column.width;
column.autoWidth = true;
}
}
I found a kendo dojo and was able to duplicate the issue there also. (http://dojo.telerik.com/oGafisuF) I modified it as this...
<
body
>
<
div
id
=
"grid"
></
div
>
<
script
>
var dt = new Date();
$("#grid").kendoGrid({
dataSource: [
{ foo: "foo", bar: "bar", somedate: dt }
],
toolbar:["excel"],
columns: [
{ field: "foo", width: "100px"},
{ field: "bar", width: "200px"},
{ field: "somedate", width: "100px", template: "#= kendo.toString(kendo.parseDate(somedate, 'yyyy-MM-dd'), 'MM/dd/yyyy') #"}
],
excelExport: function(e) {
var sheet = e.workbook.sheets[0];
for (var i = 0; i <
sheet.columns.length
; i++) {
delete sheet.columns[i].width;
sheet.columns[i]
.autoWidth
=
true
;
}
}
});
</script>
</
body
>
I have converted our solution in the last couple of days from .NET Core 2.2 to 3.0.
The last component to integrate is Kendo.Core UI MVC. The ASP.NET site compiles and runs, including the WebAPI project but the grids are not rendering data. And we have a lot of grids in a lot of templates. None work. In the debugger you can see that the following statement in the *_Read methods have data, the dsResult.Data has data ans no errors but the data does not show.
var dsResult = result.ToDataSourceResult(request);
return Json(dsResult);
This is using 2019.3.0123.
I also opened up a working POC prototype basic Kendo application that worked fine in 2.2, showing data. This was created about 6 months ago using the wizard in VS 2017. I am now using VS 2019.
The project dynamically creates the data for the read method, simple as could be. But after upgrading the project to.NET Core 3.0 the data fails to show. Again the debugger shows the result to the request formed fine. So I suspect the issue is in the binding to the grid.
Can someone at Progress shed some light on this?
If you look at the link below it is states,
"With the Telerik R3 2019 release, you will be better equipped to continue doing just that. We are so proud to release the all-new Telerik UI for Blazor, which is packed with more than 25 brand-new native components!"
In addition, we are happy to announce that our component .NET toolsets are fully compliant with the upcoming .NET Core 3.0 and are coming with tons of new controls and improvements.
https://www.telerik.com/blogs/telerik-and-kendo-ui-r3-release-2019-is-here!
Thanks
How do I display the Local DateTime in your control? Razor renders everything on the Server but I need to display DateTime values in the context of the Browser's TimeZone. Couple of scenarios:
Is there some type of event that I can tie in to that could be used to call an Action on my Controller similar to your other (Grid, Hierarchy) controls that would supply the TimeZone information?
Hello I have existing data grid in an ASP.NET Core project. I want to attach the new Kendo Filter to that grid without specifying the data source name explicitly.
Is there any way to do this?
How can I get all the visible events in the current view?
I can't use the date range to do this since I'm using a filter to filter the events by resource. For instance, if I have events A, B, C using resource 1, E, F using resource 2, after I filter the scheduler by resource 2, only events E and F will be visible. How can I get those 2 visible events in the client side?
<div class="demo-section k-content wide">
@(Html.Kendo().Chart<Telerik.Models.Testing>()
.Name("chart2")
.Title("Testing")
.Legend(legend => legend
.Position(ChartLegendPosition.Top)
)
.DataSource(ds => ds.Read(read => read.Action("MyData", "Binding")))
.Series(series =>
{
series.Column(m => m.Severity.Contains("TestingThis"), categoryExpression: m => m.Iteration)
.Name("Severity Levels")
.Aggregate(ChartSeriesAggregate.Count)
.Labels(l => l.Visible(true));
})
)
</div>
I get an InvalidOperationException: Bound columns require a field or property access expression.
The problem lies here: series.Column(m => m.Severity.Contains("TestingThis"), categoryExpression: m => m.Iteration)
Is there any way for me to filter that Severity column from my data model?
Im trying to load the datasource of a grid via jQuery, with json that has been fetched via an ajax call. I can see data in the object at runtime in the dev console, but the grid never displays the new data. What can I check
// where Lines is an array of objects of type that match the model being referenced in the grid
var lineGridDS = $("#linesGrid").data("kendoGrid").dataSource;
itemGridDS.data(Lines);
Hi All,
Want to know if this is possible and if it is how can it be achieved.
I am a .net core application with a layout using an html 5 admin templates. How can I integrate telerik .net core components in this project.
Thank you.