jqxmenu li padding and anchor click

[Peter__PanParticipant]

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

[HristoParticipant]

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

[Peter__PanParticipant]

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;
}

[Author]

Posts