Using "setItemOpenDirection" creates a problematic extra arrow

[stephanParticipant]

Hi,

Calling “setItemOpenDirection” on a menu item quite forcefully creates an arrow for the menu item, even when having ceated the menu with “showTopLevelArrows: false”. This arrow apears to be special and additional and exhibits the following strange behaviour:
* it can not be removed when (again) setting “showTopLevelArrows” to “false”
* setting “showTopLevelArrows” to “true” results in the menu item having 2 arrows

The following fiddle demonstrates the problem:
http://jsfiddle.net/ELQbS/

Initially “Test1” shows with an arrow despite “showTopLevelArrows: false”. When you click on “Show Toplevel Arrows” button you will see that “Test 1” now has 2 arrows.

Regards,
Stephan

[stephanParticipant]

Hi,

Well, I did consider it strange that you can somehow en up with two arrows, but I posted that only to alert you to the potential problem.

What I actually want is a menu that opens upwards but does not show an arrow. Thats how I found those issues I reported above. By using “showTopLevelArrows: false” on a normal menu I can create a menu without arrow that opens downwards. So all I’d like to achive is have it open upwards, but without getting an arrow added.

Is there any way to do this ?

In the documentation I only found “setItemOpenDirection”, but as you said yourself: this forces an arrow upon me.

Regards,
Stephan

[Peter StoevKeymaster]

Hi,

The solution is to set the “showTopLevelArrows” to true during the initialization, if you want to change the open direction of the items.

Best Regards,
Peter Stoev

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

[stephanParticipant]

Hi,

Ups you edited your reply while I wrote a reply to you
I’ll test your suggestion now.

Regards,
Stephan

[Peter StoevKeymaster]

Hi,

When using “setItemOpenDirection”, an arrow will be always displayed for top level items. However, you may edit that by changing the Menu’s CSS classes for the arrows or by selecting the arrow elements with jQuery and using the jQuery’s hide() method.

Best Regards,
Peter Stoev

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

[stephanParticipant]

Hi again,

You can consider this issue closed, your suggestion works. Thanks for the help.

Just for the sake of completeness, in case someone else might someday want to do the same thing, here is my code:

$(‘#’ + toolbarId).jqxMenu({
showTopLevelArrows : true
});
$(‘#’ + toolbarId).jqxMenu( ‘setItemOpenDirection’, itemId, ‘right’, ‘up’ );
$(‘#’ + toolbarId).jqxMenu( ‘showTopLevelArrows’, false );

The end result is a menu that opens upwards and has no arrows attached to the menu items.

Regards,
Stephan

[Author]

Posts