Putting a chart into a tile - error

[AP]

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

[Tsvetomir]

Hi Andrew,

I have investigated the provided code snippets and I have noticed that the chart within the tile layout has a template with the "#=#" syntax. It tries to evaluate the value in the context of the TileLayout whereas it should be evaluated in the Chart's context. You could escape it as follows:

.Tooltip(tooltip => tooltip
                    .Visible(true)
                    .Template("\\#=value\\#")
                    .Format("{0}")

Let me know if the issue persists.

 

Best regards,
Tsvetomir
Progress Telerik