jQuery UI Widgets › Forums › Navigation › Tabs › Cannot read property 'style' of undefined
Tagged: Tabs
This topic contains 1 reply, has 2 voices, and was last updated by Peter Stoev 5 years ago.
-
Author
-
I have not upgraded in sometime.
I have recently upgraded my test system to version 9.0.0
I have run into this issue
Uncaught TypeError: Cannot read property ‘style’ of undefined
at c.<computed>._verticalAlignElements (jqxtabs.js:formatted:1387)
at c.<computed>._performHeaderLayout (jqxtabs.js:formatted:1345)
at c.<computed>._performLayout (jqxtabs.js:formatted:1114)
at jqxtabs.js:formatted:224
The line: b.style.height = “100%”;
where b = jqx-tabs-titleWrapperI have 4 items in a list. It appears the last item is not getting formatted.
The first there are and it does not error out.
On the last list item b is undefined.
Here is the list after rendering you can see item #4 does not wrapped in the div jqx-tabs-titleWrapper:
I reverted back to an earlier version and it works fine.
Is there something I am missing as I move up to the new version?<ul id=”tbHLSM_Tabs_Items” class=” jqx-tabs-title-container jqx-tabs-title-container-energyblue” style=”outline: none; white-space: nowrap; margin-top: 0px; margin-bottom: 0px; padding: 0px; background: transparent; border: none; text-indent: 0px; height: 26px; width: 1920px; left: 0px; position: relative; top: 0px;”>
<li id=”tbHLSM_Tabs_Items_Section” role=”tab” class=”jqx-reset jqx-disableselect jqx-tabs-title jqx-tabs-title-energyblue jqx-item jqx-item-energyblue jqx-rc-t jqx-rc-t-energyblue -energyblue -energyblue” style=”float: left; position: static; height: 14px;”><div class=”jqx-tabs-titleWrapper” style=”outline: none; position: relative; z-index: 15; height: 100%; margin-top: 0px;”><div class=”jqx-tabs-titleContentWrapper jqx-disableselect” style=”float: left;”>Section</div><div class=”jqx-tabs-close-button jqx-tabs-close-button-energyblue” style=”height: 16px; width: 16px; float: left; font-size: 1px; display: none; margin-top: 8px;”></div></div>
<li id=”tbHLSM_Tabs_Items_PN_List” role=”tab” class=”jqx-reset jqx-disableselect jqx-tabs-title jqx-tabs-title-energyblue jqx-item jqx-item-energyblue jqx-rc-t jqx-rc-t-energyblue” style=”float: left; position: static; height: 14px;”><div class=”jqx-tabs-titleWrapper” style=”outline: none; position: relative; z-index: 15; height: 100%; margin-top: 0px;”><div class=”jqx-tabs-titleContentWrapper jqx-disableselect” style=”float: left;”>Parts Diagram</div><div class=”jqx-tabs-close-button jqx-tabs-close-button-energyblue” style=”height: 16px; width: 16px; float: left; font-size: 1px; display: none; margin-top: 8px;”></div></div>
<li id=”tbHLSM_Tabs_Items_Parts_List” role=”tab” class=”jqx-reset jqx-disableselect jqx-tabs-title jqx-tabs-title-energyblue jqx-item jqx-item-energyblue jqx-rc-t jqx-rc-t-energyblue” style=”float: left; position: static; height: 14px; display: none;”><div class=”jqx-tabs-titleWrapper” style=”outline: none; position: relative; z-index: 15; height: 100%; margin-top: 0px;”><div class=”jqx-tabs-titleContentWrapper jqx-disableselect” style=”float: left;”>Parts List</div><div class=”jqx-tabs-close-button jqx-tabs-close-button-energyblue” style=”height: 16px; width: 16px; float: left; font-size: 1px; display: none; margin-top: 8px;”></div></div>
<li id=”tbHLSM_Tabs_Items_Cart” onclick=”fn_ViewCart(”);” role=”tab” class=”jqx-reset jqx-disableselect jqx-tabs-title jqx-tabs-title-energyblue jqx-item jqx-item-energyblue jqx-rc-t jqx-rc-t-energyblue” style=”float: left; position: static; height: 14px;”>Cart (0)Hi,
Could you share jsfiddle.net or codepen sample?
Regards,
Peter -
AuthorPosts
You must be logged in to reply to this topic.