RadTabStrip producing JS Errors

[Thirumoorthi]

Hi,

     

[Thirumoorthi]

Hi, 

      Sorry, Accidentally submitted empty post. In my project I'm using .NET for Ajax 2018. Recently I updated it to telerik 2020 (2020.3.1021.45) trial version to test the compatibility of telerik with the application.

      The upgrade process was successful. I'm able to run the application. But none of the dropdowns worked and many javascript codes are broken. I can see 2 Javascript errors in console. The error is as follows. (Attached a picture of the console errors)

1.Uncaught TypeError: Cannot read property 'get_visible' of undefined - this one is caused by Radtabstrip "ReorderTabsOnSelect" Attribute.

2.Uncaught TypeError: Cannot read property 'get_visible' of undefined - this one is caused by Radtabstrip "Align" attribute

 

After Removing "ReorderTabsOnSelect", "Align" attributes from RadTabStrip everything working fine. there is no errors.
Is this a breaking change in Telerik 2020? How i can solve this problem ? Because i need those 2 attributes in RadTabStrip.

 

The code:

<telerik:RadTabStrip ID="RadTabStrip1" runat="server" Skin="Orange" MultiPageID="RadMultiPage1" SelectedIndex="0" Align="Justify" ReorderTabsOnSelect="true" Width="250px" EnableEmbeddedSkins="False">
  <Tabs>
    <telerik:RadTab Text="Tab Title">
    </telerik:RadTab>
  </Tabs>
</telerik:RadTabStrip>
<telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0" CssClass="pageView">
  <telerik:RadPageView ID="RadPageView1" runat="server" height="720px">
    <div>Content</div>
  </telerik:RadPageView>
</telerik:RadMultiPage>

[Peter Milchev]

Hello,

Thank you for reporting this issue and sharing your solution.

There is indeed a small regression in the TabStrip regarding this exact property, and when it is set, there is a JavaScript error in the browser console that is actually breaking the normal behavior. 

This issue is already fixed in the source code and will be available in the next official release.

In the meantime, you can place the following script under the ScriptManager and before any RadTabStrip instances and this will fix the issue for all pages without removing the property.

if(Telerik.Web.UI.RadTabStrip){
     Telerik.Web.UI.RadTabStrip._getTabGroups = function(listElement, sizeProperty)
    {
        var groups = [];
        var currentGroup = [];
        currentGroup.size = 0;
        Array.add(groups, currentGroup);

        var listItems = $telerik.getChildrenByTagName(listElement, "li");
        for (var i = 0; i < listItems.length; i++)
        {
            if (listItems[i].className == "rtsBreak")
            {
                currentGroup = [];
                currentGroup.size = 0;
                Array.add(groups, currentGroup);
                continue;
            }

            var sizeToAdd;

            //In all browsers exept IE8 and above the actual size contains fractions of a pixel which are rounded when offsetWidth/offsetHeight properties are used.
            //Use getComputedStyle instead to sum the actual size and then round it up, otherwise the last tab will fall on the next row.
            if (!($telerik.isIE7 || $telerik.isIE8)) {
                var computedStyles = getComputedStyle(listItems[i]),
                    computedStyle = 0;

                // invisible items break logic as .width returns "auto"
                if (computedStyles && $(listItems[i]).is(":visible")) {
                    computedStyle = sizeProperty == "offsetWidth" ? (parseFloat(computedStyles.width) + parseFloat(computedStyles.paddingLeft)) : parseFloat(computedStyles.height);
                }

                sizeToAdd = computedStyle;
            } else {
                sizeToAdd = listItems[i][sizeProperty];
            }

            currentGroup.size += sizeToAdd;

            Array.add(currentGroup, listItems[i]);
        }

        if (!($telerik.isIE7 || $telerik.isIE8)) {
            Array.forEach(groups, function(group) {
                group.size = Math.ceil(group.size);
            });
        }

        return groups;
    };
}

Let me know if you have any further questions.

Regards,
Peter Milchev
Progress Telerik