How to change Default Selected Menu Item in Menu Navigation | CRMHC 7.31 on Pega 7.3.1
I am trying to change the default selected Menu item in Menu Navigation.
I am using Primary Navigation (as given in attachment)
I tried explicitly using a Javascript in a section on load of the Section using Menu Navigation as below but no luck :
<script>
pega.u.d.attachOnload(function(){
var elems = $(".menu-format-primary-navigation> li");
var index=2;
index=parseInt(index);
elems.first().removeClass("menu-item-active");
elems.find("li:eq("+index+")").addClass("menu-item-active");
});
</script>
Is there some way to handle this easily whenever required?
Accepted Solution
Pegasystems Inc.
IN
Hi,
Please try this slightly modified code if you really want to change the highlighted menu item using JS:
<script>
pega.u.d.attachOnload(function(){
var elems = $(".menu-format-primary-navigation> li");
if (elems.length > 0) {
elems.first().removeClass("menu-item-active");
var idx = 2;
$(elems[idx]).addClass("menu-item-active");
}
}, true);
</script>
Tetrasoft India Private Limited
IN
Hello Marc,
On section load, I am trying to highlight the 3rd menu item in a menu navigation using vertical alignment with Primary Navigation style as attached.
Pegasystems Inc.
US
I do not think you can "default" a menu item. May be move it as the first item in your menu so that its on top by default ?
Also on section load, the menu item is collapsed right ? Have you written code to "open" it by default ?
Before you place the focus on the second element, try to simulate the onClick on the <A> element that hosts the menu and then place the focus on the menu item
Tetrasoft India Private Limited
IN
May be move it as the first item in your menu so that its on top by default ?
We cannot shift the menu item to the top
Also on section load, the menu item is collapsed right ? Have you written code to "open" it by default ?
No I am not opening it by default. But this should not change anything here because I am able to change active menu item on load. This issue is that it is set back in few seconds back to first menu item. So, I need to undo that.
Pegasystems Inc.
US
Something like this,
document.getElementsByName("<your menu link here >")[0].click()
You might want to test it on all browsers to check whether it works. click() may not be supported by all browsers.
CollabPartnerz
IN
Below link might help you
Accepted Solution
Pegasystems Inc.
IN
Hi,
Please try this slightly modified code if you really want to change the highlighted menu item using JS:
<script>
pega.u.d.attachOnload(function(){
var elems = $(".menu-format-primary-navigation> li");
if (elems.length > 0) {
elems.first().removeClass("menu-item-active");
var idx = 2;
$(elems[idx]).addClass("menu-item-active");
}
}, true);
</script>