How to disable permalink of a particular menu item?

How about just go to the menu from wp-admin remove product menu(i.e the current one) now create a new menu (Product)using Custom Menu and put url to # and add ur sub menus, if u have different class for current menu u can add custom class too follow these steps In Appearance > Menus, click the Screen Options tab. Under Show advanced menu properties, check CSS Classes. Now expand any menu item to reveal the CSS Classes (optional) text input

thanks

Personnaly, I prefer use filters to manipulate data before menu generation.

Example with wp_setup_nav_menu_item:

add_filter('wp_setup_nav_menu_item', function($menu) {
    $menu->url = "";
    return $menu;
});

This filter is ran on each retrieved menu item but without nowing which menu is currently processed.

Another example with wp_get_nav_menu_items :

add_filter('wp_get_nav_menu_items', function($items, $menu) {
    if( $menu->slug === 'menu-principal' ) {
        foreach ($items as &$item) {
            if ($item->ID === 'MY-PRODUCT-PAGE-ID') {
                $item->url = "";
            }
        }
    }
    return $items;
}, 10, 2);

This other filter is ran after all the menu items have been retrieved. You can also access the current menu Term details in the $menu variable (be sure to give 2 as the latest add_filter argument to retrieve menu details).

The default "walker" take care of the url property value to adapt HTML structure and behaviour. I think it can solve your problem.

If you want to do this with PHP then use a custom walker and targeting the menu directly (if is menu item xxx), but jQuery will do this easily for you using removeAttr

$("#menu-item-xxx"). removeAttr("href");

That won't remove the tag, just removes the href="" from the tag.