jQuery UI Widgets Forums Navigation Menu, Context Menu RTL dont change to False after set True

This topic contains 2 replies, has 2 voices, and was last updated by  lucasmelocvl 8 years, 3 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • RTL dont change to False after set True #78044

    lucasmelocvl
    Participant

    Hello,

    On my applicattion I have four small menus (using jqxMenu) on same page. Two menu on left side, and others two on right side.
    The menus on left side, I need to open the sub-menus to right, therefore rtl is set up False. And the menu on right side, I need to open the sub-menus to left side, therefore rtl is set up True.

    Well, the problem is: When I firstly open the menus on left side, rtl is set up False, and is openned normally with submenu to right. But when I open the menus of right side (where the rtl is set up to True) and after close the last menu of right side, I open other menu on left side, the rtl on left menu stay set up as True, and submenus are open to left side, even I set to false. Maybe the value of rtl when setted as True, stay save on cache, but I cant modify his value.

    This code is for left Menu

    $("#jqxMenu").jqxMenu({
                rtl: false,
                autoCloseOnClick: false,
                source: source,
                width: '180px',
                height: '180px',
                mode: 'vertical',
            });

    And this code is for rightMenu

    $("#jqxMenu").jqxMenu({
                rtl: true,
                autoCloseOnClick: false,
                source: source,
                width: '180px',
                height: '180px',
                mode: 'vertical',
            });

    They need use the same ID, but it is rendered on differents location.

    It’s a bug? Anyone have suggestions?
    Since now, thank you.

    RTL dont change to False after set True #78088

    Dimitar
    Participant

    Hello lucasmelocvl,

    Different instances of the same widget have to have different ids when they are on the same page. This is also a general HTML rule: https://html.spec.whatwg.org/multipage/dom.html#the-id-attribute. Please try changing the id of the second menu and share if the issue still occurs.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    RTL dont change to False after set True #78123

    lucasmelocvl
    Participant

    Thank you so much, it’s worked.

    I will detail the problem and the resolution:
    I was trying build the page dynamically, with html and js, having same differents instances of same id, they never be render on same time, because of this I think that could work. I had just one div with ‘nav-small’ id on index.html.
    <div id='nav-small-a'></div>
    And one js that render ‘nav-small’, of menu positions different and elements different when necessary.

    function exameple_menu_a(){
    ...
            nav_small.style.top = topPosition;
            nav_small.style.left = leftPosition;
            nav_small.style.right = rightPosition;
            $("#nav-small-a").jqxMenu({
                rtl: false,
                autoCloseOnClick: false,
                source: source,
                width: '180px',
                height: '180px',
                mode: 'vertical',
            });
    ...
    }
    
    funtion exameple_menu_b(){
    ...
            $("#nav-small-a").jqxMenu({
                rtl: true,
                ...
            });
    }
    
    ...

    To resolve:
    But now, I created four div on index.html like ‘name-small-a’, ‘name-small-b’, ‘name-small-c’, ‘name-small-d’.

       <div id='nav-small-a'></div>
        <div id='nav-small-b'></div>
        <div id='nav-small-c'></div>
        <div id='nav-small-d'></div>

    And I created the menu for especific div.

    function exameple_menu_a(){
    ...
            nav_small.style.top = topPosition;
            nav_small.style.left = leftPosition;
            nav_small.style.right = rightPosition;
            $("#nav-small-a").jqxMenu({
                rtl: false,
                autoCloseOnClick: false,
                source: source,
                width: '180px',
                height: '180px',
                mode: 'vertical',
            });
    ...
    }
    
    funtion exameple_menu_b(){
    ...
            $("#nav-small-b").jqxMenu({
                rtl: true,
                ...
            });
    }
    
    ...

    And now, it’s worked correctly with four id.

    I tried to shorten the code , but I ended up getting worse.
    Thank you for your help.

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

You must be logged in to reply to this topic.