I'm trying to create a tile based dashboard, but when I try to put a chart into a container, I get the error:-
VM391:3 Uncaught ReferenceError: value is not defined at eval (eval at compile (kendo.all.js:234), <anonymous>:3:1161) at init._initContainers (kendo.all.js:174269) at new init (kendo.all.js:174169) at HTMLDivElement.<anonymous> (kendo.all.js:2520) at Function.each (jquery.min.js:2) at n.fn.init.each (jquery.min.js:2) at n.fn.init.e.fn.<computed> [as kendoTileLayout] (kendo.all.js:2519) at HTMLDocument.<anonymous> (Index:87) at i (jquery.min.js:2) at Object.fireWith [as resolveWith] (jquery.min.js:2)--
The chart when placed outside of the TileLayout, works perfectly, and the chart from the demo works as well.
the code is:-
<script id="IPWL_WL" type="text/x-kendo-template"> @(Html.Kendo().Chart<BSOLPTLPortal.Models.IPWLWaitChartRecord>() .Name("ipwlChartOne") .Title(title => title .Text("Inpatient Waiting List - Waiting List (11)") .Visible(true) .Position(ChartTitlePosition.Top)) .Theme("office365") .Legend(legend => legend .Visible(false) .Position(ChartLegendPosition.Bottom) ) .Series(series => series .Column(model => model.Value).Labels(true).Gap(0.5) ) .ChartArea(area => area .Height(350) .Background("transparent") ) .CategoryAxis(axis => axis .Categories(model => model.WaitingBand) .Labels(labels => labels.Rotation(0)) .MajorGridLines(lines => lines.Visible(false)) .Title("Weeks Waiting" ) ) .ValueAxis(axis => axis.Numeric().Title("People Waiting").Visible(true) ) .DataSource(ds => { ds.Read(read => read.Action("_IPWLChartbyAdmissionTypex", "IPWL") ); } ) .Tooltip(tooltip => tooltip .Visible(true) .Template("#=value#") .Format("{0}") ).ToClientTemplate() )</script>@(Html.Kendo().TileLayout() .Name("tilelayout") .Columns(2) .RowsHeight("285px") .ColumnsWidth("50%") .Containers(c => { c.Add().Header(h => h.Text("Header One")).BodyTemplateId("IPWL_WL").ColSpan(1).RowSpan(1); c.Add().Header(h => h.Text("Header Two")).BodyTemplate("Body Text Two").ColSpan(1).RowSpan(1); c.Add().Header(h => h.Text("Header Three")).BodyTemplate("Body Text Three").ColSpan(2).RowSpan(1); }) .Reorderable(true) .Resizable(true) )
I'm using version v2021.1.119 of Kendo UI for MVC.
Thanks
Hi,
I have two Kendo grids in my MVC page,. Each of grid inside its own <div> block. I need show them based on returned data. I code this “SHOW” condition in databound event. But have rendered issue (See attached image) when do that. If I remove the conditions, both grids showed correctly. Could someone help for the issue? Thanks in advance.
Function onDataBoundGrid1 (e) {
if (e.sender._data.length > 0) {
$("#grid1Div").show();
else {
$("#grid1Div").hide();
}
}
Function onDataBoundGrid2 (e) {
if (e.sender._data.length > 0) {
$("#grid2Div").show();
else {
$("#grid2Div").hide();
}
}

Hi,
I have a grid that will create multiple records in the database on Create/Update of any record in the grid. I would like to refresh the grid once the create/insert is complete so that all the newly created records will be visible to the user. How can I do that?

Hi,
I am trying to create logic to allow clicking in the Badge, based on the recommendations in https://www.telerik.com/forums/badge-click-to-execute-code-in-controller-class, to run code in the Controller but needs some direction.
The Controller is called (using ajax call in example 1) when clicking on "Get total" (in example 2) but what to use in the badge to make it execute? Not the name of it, right? (already tried this and nothing happens...)
Please describe on how to invoke the ajax call from a badge or tell me if badges cannot be used in this way. I would also like to know the rationale in not embedding native click logic to the badge. I mean, if showing an aggregated value of something, why wouldn't you want to link to the data the value is calculated from?
Example 1
<script>
$("#badge-total").click(function () {
$.ajax({
url: '@Url.Action("ShowTotalGrid")',
dataType: "json",
type: "POST",
contentType: 'application/json; charset=utf-8',
cache: false,
data: {},
success: function (data) {
if (data.success) {
alert(data.message);
}
},
error: function (xhr) {
alert('error');
}
});
});
</script>
Example 2
<div id="badge-total">
Get total
</div>
/Regards Anders
In this case I have a grid with a few locked/fixed columns, followed by a couple of groups of columns under one header. Something like this:
01.@(Html.Kendo().Grid<GradeBusinessLayer.ViewModels.Assets.ElectricalCableDetailViewModel>()02. .Name("grid")03. .Columns(columns =>04. {05. columns.Bound(d => d.Object).Width(200).Locked(true).Lockable(false);06. columns.Bound(d => d.Revision).Width(200).Locked(true).Lockable(false);07. 08.@* ==== BLOCK: Info ====*@09. columns.Group(grp4376 => grp437610. .Title("Info")11. .HeaderTemplate("<div style='display:flex'><span class='k-link' style='text-overflow: ellipsis;white-space: nowrap;overflow: hidden;''>Info</span><span> <i class='fa fa-eye' onclick='hideGroup(this)' aria-hidden='true'></i></span></div>")12. .Columns(col4376 => {13. col4376.Bound(d => d.Alias).Width(200);14. col4376.Bound(d => d.SubClass1Name).Width(200);15. col4376.Bound(d => d.CheckedBy).Width(200);16. col4376.Bound(d => d.CheckedDate).Width(200);17. .18. .19. .The column group should be collapsible. This is intended to be different from hiding the group, because the user should be able to uncollapse it again. I could not find a standard way to do this, so I devised my own, with which I'm partially satisfied.
How I did it: The group now has a caption, followed by an eye (from font-awesome, but this could of course by any glyph). When the eye is clicked, a javascript function replaces the eye with a slashed eye and hides all the columns, except for the first. This is that function:
01.function hideGroup(vis)02.{03. vis = $(vis);04. var grd = $("#grid").data("kendoGrid");05. 06. var cell = vis.closest("th");07. var row = cell.closest("tr");08. var grpIdx = $("th", row).index(cell);09. 10. var grpCol = undefined;11. for (i=0; i<grd.columns.length; i++)12. {13. if (typeof grd.columns[i].columns !== "undefined")14. {15. if (grpIdx-- === 0)16. {17. grpCol = grd.columns[i];18. break;19. }20. }21. }22. 23. if (typeof grpCol === "undefined")24. return;25. 26. if (vis.hasClass("fa-eye"))27. {28. vis.removeClass("fa-eye");29. vis.addClass("fa-eye-slash");30. for (i=grpCol.columns.length-1; i>0; i--)31. grd.hideColumn(grpCol.columns[i]);32. }33. else34. {35. vis.removeClass("fa-eye-slash");36. vis.addClass("fa-eye");37. for (i=grpCol.columns.length-1; i>0; i--)38. grd.showColumn(grpCol.columns[i]);39. }40.}
So first the header cell is discovered. Then the index of that header cell in the row. Then the columns are enumerated until the column with that index is found, not counting the columns that don't have subcolumns (those are the fixed columns and they are in a different <tr>, it turns out, so I cannot use the grpIdx straight away). When the column object has been identified, it can be used to iterate its columns to show/hide them as intended.
My questions:

Hi,
I have Badges that display different sums of data. I would like to filter a Grid based on clicking a them.
Is it possible to execute code in Controller class when clicking on a Badge, or do I have to rethink this? Can you please point me in the right direction?
Regards, Anders
[Display(Name = "Type Id")] [Editable(false)] public int ReportTypeId { get; set; }hi.
when i copied a text from MsWord to Editor, the url of FootNote content changed and not working.
i attached a pic of rendered editor text.
plz help
thanks
I'm new in the ASP.NET MVC development.
After I add the dataset under the model folder.
I create an empty Controller and want to add view inside Index() method.
I choose Template as Create, and error message come up
"There was an error running the selected code generator:
'an error occurred while retrieving package metadata for
'EntityFramework.6.1.3' from source 'nuget.telerik.com''"
Could you tell me how to add a view, if need more details, plz let me know!!
