jQuery UI Widgets Forums Navigation Menu, Context Menu jqxmenu li padding and anchor click

This topic contains 2 replies, has 2 voices, and was last updated by  Peter__Pan 2 years, 7 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • jqxmenu li padding and anchor click #94946

    Peter__Pan
    Participant
    <div id="jqxDictionaryMenu">
                <ul>                
                    <li><a href="~admin/colors" class="menu-link" data-target="body">Colors</a></li>
                    <li><a href="~admin/manufactures" class="menu-link" data-target="body">Manu</a></li>
                </ul>
    </div>
    
     $('#jqxDictionaryMenu').on('itemclick', function (e) {               
                    $("#body").load(e.target);               
                    //$('#' + $(e.args.children[0]).data("target")).load($(e.args.children[0]).attr("href"));
                    return false;
                });

    But LI in menu has class
    .jqx-menu-item-top {
    border: 1px solid transparent;
    text-indent: 0;
    list-style: none;
    padding: 4px 8px 4px 8px;
    left: 100%;
    overflow: hidden;
    color: inherit;
    right: 0;
    margin: 0px 1px 0px 1px;
    cursor: pointer;
    }

    So my a-tag is not stretched in LI and if I click out the a (even a.menu-link {display: block;})
    next code from jqxmenu.js is running

    f.addHandler(c, "click", function(c) {
                        if (!b.disabled && !f.disabled && (f.keyboardNavigation && (f.activeItem && a(f.activeItem.element).removeClass(f.toThemeProperty("jqx-fill-state-focus")),
                        f.activeItem = b,
                        a(b.element).addClass(f.toThemeProperty("jqx-fill-state-focus")),
                        f.minimized && c.stopPropagation()),
                        f._raiseEvent("2", {
                            type: "mouse",
                            item: b.element,
                            event: c
                        }),
                        f.autoOpen ? !f.autoCloseOnClick || g || f.clickToOpen || b.closeOnClick && (c.data = f,
                        f._closeAll(c)) : b.level > 0 && (!f.autoCloseOnClick || g || f.clickToOpen || (c.data = f,
                        f._closeAll(c))),
                        g && f.autoCloseOnClick && (c.data = f,
                        b.hasItems || f._closeAll(c)),
                       "A" != c.target.tagName && "a" != c.target.tagName)) {
                            var d = null != b.anchor ? a(b.anchor) : null;
                            if (null != d && d.length > 0) {
                                var e = d.attr("href")
                                  , h = d.attr("target");
                                null != e && (null != h ? window.open(e, h) : window.location = e)
                            }
                        }
                    })

    and it is not that I want, because it returns partial html in page instead in target-element
    How to prevet it? Thanks!

    • This topic was modified 2 years, 7 months ago by  Peter__Pan.
    jqxmenu li padding and anchor click #94991

    Hristo
    Participant

    Hello Peter__Pan,

    Please, avoid posting code from our sources, because it is illegal.
    About the mentioned case I would suggest you type validation and recognize when clicking on the correct place then it happens desired action.

    if(isAnchorTag) {
    	// Do logic
    }

    Best Regards,
    Hristo Hristov

    jQWidgets team
    http://www.jqwidgets.com

    jqxmenu li padding and anchor click #95029

    Peter__Pan
    Participant

    thanks, Hristo, but your solution is not good for me, and events from jqmenus.js still running

    as temporarly solution I did so to prevent standart behavior

    $(e.args).unbind('click');

    and edit some css

    li.jqx-menu-item-top > a.menu-link {
        display: block;
        padding: 4px 8px;
    }
    
    .jqx-menu-item-top, .jqx-menu-item-top:hover {
        padding: 0px !important;
    }
    • This reply was modified 2 years, 7 months ago by  Peter__Pan.
Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.