Question

Good day,

Please assist: I am adding list items into an unordered list. Inside the list items I have an anchor that does not have an ID. I am trying to invoke the click event handler but obviously I am doing something wrong.

List item rendering:

this.RenderMeNav = function (params) {
        var ul, li, a, heading;
        var me = ARRAY.Search({
            List: params.Permissions,
            Properties: ["Group"],
            Value: "me"
        });
        heading = $("<a href=\"javascript:void(0);\" class=\"heading\">Me<span class=\"icon-vertical icon-up\"/></a>");
        ul = $("<ul />");
        for (var p in me) {
            li = $("<li></li>");
            a = $("<a href=\"" + me[p].Url.replace("~/", "") + "\">" + me[p].Name + "</a>");
            a.click(function (e) {
                ShowProcessing();
                ifrm.document.location.href = $(this).attr("href");
                e.preventDefault();
            });
            li.append(a);
            ul.append(li);
        }
        $("#menu").append(heading);
        $("#menu").append(ul);
    };

And then when something else is clicked, I call this function:

this.OpenSection = function (params) {
        $("#menu li").each(function () {
            if ($(this).text().toLowerCase() == params.Name.toLowerCase()) {
                $(this).click(); //I FOUND THE ANCHOR AND NOW I WANT TO INVOKE IT'S CLICK EVENT
            }
        });
    }

I tried some of the suggestions on the other questions which is similar, but to no avail.

Regards

Answer 1

You’re attaching the event to the anchor, but triggering the click of the list item. Try and find the anchor that’s in the list item and triggering it’s click:

this.OpenSection = function (params) {
        $("#menu li").each(function () {
            if ($(this).text().toLowerCase() == params.Name.toLowerCase()) {
                $(this).find("a").trigger("click");
            }
        });
    }