Disable redirect on menu section of a dropdown menu

Biswajyoti Dutt
Mega Expert

I am developing a site using CMS. I have created a site which uses a navigational menu. The menu used is a dropdown. I want to disable the redirect feature on the menu section.

On clicking any of the menu section, I have right now set the page to reload. However, I would like to disable the redirect feature and only have the menu section displaying the menu items, when I click on it.

Please help me with this.

Thanks.

1 ACCEPTED SOLUTION

Hi,



Didn't knew that you are targeting for touch devices!


You can actually achieve it by changing in UI Macro:


Goto: https://<instance-name>.service-now.com/nav_to.do?uri=sys_ui_macro.do?sys_id=1f4b69820a0a0b9230c67f5eeffc7450



All you need to do is, search for ["href="${jvar_link_url}"] and remove it.


Basically you are removing the HREF from the <a> clickable links, rest everything would work as is.


* You do not have to remove the links from menu section anymore.



Hope this help!


Mark thread as "Answered" if you are satisfied with an answer and let me know if you have any followup question for me.



-Manjul


View solution in original post

5 REPLIES 5

Manjul Katare
ServiceNow Employee
ServiceNow Employee

Hi Biswajyoti,



If I understood you correctly, you want to actually disable the header items (Home/order things/Knowledge....) clicking but do want the drop down menu items to work as is?


if so its bit difficult because if you disable the headers <a>'s then it would not show the drop down items as the hover/mouseover event would not trigger.



There is small css trick you can use so that user would less likely click on its header item itself and they would   drill down to header menu items.



links.png



if this works, you can try below css snippet.



div.cms_menu_dropdown_container a.cms_menu_dropdown_link:hover {


      cursor: default;


      background-image: none;


}


div.context_menu div[item_id="undefined"]:hover {


      cursor: pointer;


}



Thanks,


Manjul


Thanks Manjul for the workaround, but why I wanted to resolve this is because while testing the website for a mobile view (on browser), I found that the user is not able to use the header menu, since it redirects to the page before the user can select a sub menu item.



Could you please let me know if I can stop this redirect?



I also have another problem regarding the scroll bar Scroll bar is not appearing for one page of a site in CMS , I have provided additional details there as you have asked. Could you please help me on that one as well?



Thanks a lot for your help so far.


Hi,



Didn't knew that you are targeting for touch devices!


You can actually achieve it by changing in UI Macro:


Goto: https://<instance-name>.service-now.com/nav_to.do?uri=sys_ui_macro.do?sys_id=1f4b69820a0a0b9230c67f5eeffc7450



All you need to do is, search for ["href="${jvar_link_url}"] and remove it.


Basically you are removing the HREF from the <a> clickable links, rest everything would work as is.


* You do not have to remove the links from menu section anymore.



Hope this help!


Mark thread as "Answered" if you are satisfied with an answer and let me know if you have any followup question for me.



-Manjul


Hello Manjul,



Thanks for the answer. This was indeed what I was looking for. Could you also please let me know whether you could help me with my other question Scroll bar is not appearing for one page of a site in CMS .



With regards,


Biswajyoti Dutta