jQuery UI Widgets Forums Navigation Tabs Cannot read property 'style' of undefined

Tagged: 

This topic contains 1 reply, has 2 voices, and was last updated by  Peter Stoev 5 years ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • Cannot read property 'style' of undefined #108262

    narnone
    Participant

    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-titleWrapper

    I 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)


    Peter Stoev
    Keymaster

    Hi,

    Could you share jsfiddle.net or codepen sample?

    Regards,
    Peter

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.