Tips for implementing a client-side event when an asp:menu item is clicked

Question

Tips for implementing a client-side event when an asp:menu item is clicked

Currently, I'm incorporating the <asp:Menu> control into my website and populating it with data from a table in my Sql Server database using an XML data source. Now, I am looking to implement a client-side event when a user clicks on a menu item. Specifically, I want to display a "please wait" dialog window until the page is fully refreshed after the click. To achieve this, I need to execute a JavaScript function upon the menu item click. Could anyone provide guidance on how to set up a client-side click event for these menu items?

javascript asp.net

Answer 1

Answer №1

Issue resolved through the inclusion of specific CSS classes

<DynamicMenuStyle CssClass="primaryDynamicMenu" />
<StaticMenuStyle CssClass="primaryStaticMenu"/>

Additionally, a jQuery function was implemented for main menu items:

$(function() {
    $(".primaryStaticMenu a").each(function(index) {
        $(this).click(function() {
            alert($(this).attr("href"));
        });
    });
});

For sub-menu items:

$(function() {
    $(".primaryDynamicMenu a").each(function(index) {
        $(this).click(function() {
            alert($(this).attr("href"));
        });
    });
});

Answer 2

Issue resolved through the inclusion of specific CSS classes

<DynamicMenuStyle CssClass="primaryDynamicMenu" />
<StaticMenuStyle CssClass="primaryStaticMenu"/>

Additionally, a jQuery function was implemented for main menu items:

$(function() {
    $(".primaryStaticMenu a").each(function(index) {
        $(this).click(function() {
            alert($(this).attr("href"));
        });
    });
});

For sub-menu items:

$(function() {
    $(".primaryDynamicMenu a").each(function(index) {
        $(this).click(function() {
            alert($(this).attr("href"));
        });
    });
});

Tips for implementing a client-side event when an asp:menu item is clicked

Answer №1

Similar questions

The issue with anchor links not functioning correctly in Chrome's desktop browser has been identified

What is the best way to break out of a function halfway through?

Guide on executing a jar file using JavaScript and obtaining a JSON output

How can I access data from a function that is executed within a method in Vue.js?

Persistent NW.js Local Storage Cache Remains Present even After Deleting Application

Retrieve tag, custom taxonomy, and attachment information using the get_pages function

transmitting error messages from a service to a controller in AngularJS

Steps for positioning an item above CardActionArea

Tips on retrieving and showcasing information from various endpoints in React?

Angular ng-repeat with toggle filter

Halt spread: descend in a bubble?

What is the best way to pass an array to a child component in React?

Is it possible for a prop to change dynamically?

Send form using AJAX with a callback function

Updating the contents of a DIV element in a Django application

Internet Explorer displaying incorrect formatting for HTML CSS tables

What is the reason for the addEventListener function not being able to access global variables?

In the Opera browser, the closing script tags seem to mysteriously vanish

Issue encountered while generating a package using npm init in Node.js

Why won't the function activate on the initial click within the jQuery tabs?