As per the subject, if you use jQuery to get a Kendo TabStrip in a ComboBox change event it inserts this div into the TabStrip control:
<div class="k-tabstrip-items-wrapper k-hstack">
<ul class="k-tabstrip-items k-reset" role="tablist"></ul>
</div>
This used to work as we were changing the selected tab in a TabStrip based on a ComboBox selection, but this no longer works. Please see the following REPL where a new div is added every time you change the ComboBox value:
https://netcorerepl.telerik.com/mxETafaT24zWOe0C50
Kind regards,
David
Hello David,
Thank you for taking the time to prepare a REPL sample that replicates the issue.
The unexpected behavior is caused by the kendoTabStrip() method - it initializes a new TabStrip component from the <div> element with the id "tabstrip", which is rendered as a result of the TabStrip HtmlHelper initialization.
To get a reference to the existing TabStrip on the page in the ComboBox Change event handler, you can use either the jQuery data() method or the getKendoTabStrip() method. For example:
function onComboChange(e) {
var tabStrip = $("#tabstrip").data("kendoTabStrip");
console.log(tabStrip);
}
function onComboChange(e) {
var tabStrip = $("#tabstrip").getKendoTabStrip();
console.log(tabStrip);
}
Please update the TabStrip reference in the "onComboChange" function as per any of the examples above and let me know if it works as expected at your end.
Regards, Mihaela Progress Telerik