TabStrip ActivateTab() throws Js Error

[jovaughn]

Running

$("#tabStrip").kendoTabStrip().data("kendoTabStrip").activateTab($("#tabstrip-tab-3"));

on Doc Ready in the demo throws a Javascript error and the 3rd tab("Moscow") is not selected.

"Uncaught TypeError: Cannot read properties of undefined (reading 'length')" - logged in Console

What am I doing wrong?

https://netcorerepl.telerik.com/cFFlFhGv515cOcCN27

[Mihaela]

Hello Jovaughn,

Thank you for sharing the REPL example.

The exception is thrown because the TabStrip component is already initialized through the HtmlHelper (@(Html.Kendo().TabStrip().Name("tabstrip") ... )) and the 'kendoTabStrip()" initializes the widget one more time. It leads to a duplicated initialization.

You could either use the jQuery data() method or the getKendo<WidgetName> method to get an instance of the defined TabStrip component.

The example below illustrates how to get a reference to the existing TabStrip and use the activateTab() method to select the 3rd tab:

<script>
    $(function() {
        $("#tabstrip").data("kendoTabStrip").activateTab($("#tabstrip-tab-3"));
    });
</script>

Here is the revised REPL example: https://netcorerepl.telerik.com/GbFbGwbR48wSrCsq26

If any other questions arise, feel free to let me know.

 

Regards, Mihaela Progress Telerik