Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
80
WebDataMenu javascript error in IE8
posted

Hello,

I have a WebDataMenu inside of a tab of an AjaxControlToolkit TabContainer, with a few WebImageButtons arranged horizontally. The page renders correctly in IE9, Chrome, etc, but when I switch my IE to IE8 mode and IE8 standards, I see a javascript error in some of the javascript code, in a function named __resizeListItems (line 468 is bolded and underlined):

Line: 468
Error: Invalid argument.

__resizeListItems:function(item)
{
   /* 2010-02-18 Bug#16534 - get the group height and go resize inner LI's 
    * do not set line-height accordingly, eventhough it is the only way
    * to make texts appear aligned vertically.
    * setting line-height will propaged throughout the children which is not desired!
    */
   var group = this.get_element().getElementsByTagName("UL")[0];
   if(!$util.isNullOrUndefined(item))
   {
       group = item._get_subgroup();
   }

   var childItem = this.getItems().getItem(0);
   var grpSettings = this._menuGroupSettings;
   if(!$util.isNullOrUndefined(item))
   {
       childItem = item.get_childItem(0);
       grpSettings = item.get_itemsGroupSettings();
   }

   if($util.isNullOrUndefined(childItem) || $util.isNullOrUndefined(grpSettings))
       return;

   if(grpSettings.get_orientation() == $IG.Orientation.Vertical)
       return;

   if(childItem._element.style.height != "" || childItem._element.style.height.length > 2) return;

   var MaxHeight = 0;
   var nChildItem = childItem;
   while(nChildItem != null)
        {
            if(!nChildItem.get_isSeparator())
            {
                (nChildItem._element.offsetHeight > MaxHeight) ? MaxHeight = nChildItem._element.offsetHeight: null;                    
            }
            nChildItem = nChildItem.get_nextItem();
        }

   if(childItem != null)
   {
     MaxHeight -= $util.toIntPX(null, 'paddingBottom', 0, childItem._element);
       MaxHeight -= $util.toIntPX(null, 'paddingTop', 0, childItem._element);
       MaxHeight -= $util.toIntPX(null, 'borderTopWidth', 0, childItem._element);
       MaxHeight -= $util.toIntPX(null, 'borderBottomWidth', 0, childItem._element);
       MaxHeight -= $util.toIntPX(null, 'marginBottom', 0, childItem._element);
       MaxHeight -= $util.toIntPX(null, 'marginTop', 0, childItem._element);
       MaxHeight -= $util.toIntPX(null, 'paddingBottom', 0, group);
       MaxHeight -= $util.toIntPX(null, 'paddingTop', 0, group);
       MaxHeight -= $util.toIntPX(null, 'borderTopWidth', 0, group);
       MaxHeight -= $util.toIntPX(null, 'borderBottomWidth', 0, group);
       MaxHeight -= $util.toIntPX(null, 'marginBottom', 0, group);
       MaxHeight -= $util.toIntPX(null, 'marginTop', 0, group); 
   }

        while(childItem != null)
        {
            if(!childItem.get_isSeparator())
            {
                childItem._element.style.height = MaxHeight + 'px';                    
                //childItem._element.style.lineHeight = groupHeight + 'px';                    
            }
            childItem = childItem.get_nextItem();
        }
},

When I step through this with a debugger, i see that MaxHeight gets set to '-2' from the code above, and then IE does not show the entire TabContainer when this error occurs.
I've tried setting and removing Height values on the WebImageButtons with no luck. I also verified there are no CSS attributes being applied to the WebDataMenu or WebImageButtons.