1

I have a team site inside my SharePoint on-premises farm 2013, inside the team site i added a custom list which contain 3 content types. Now when i create a new items inside the custom list, i will get different urls based on the content type, as follow:-

/Lists/Management/NewForm.aspx?ContentTypeId=111&RootFolder=/Management/Lists/Management

/Lists/Management/NewForm.aspx?ContentTypeId=222&RootFolder=/Management/Lists/Management

/Lists/Management/NewForm.aspx?ContentTypeId=333&RootFolder=/Management/Lists/Management

Then to ease the process on end users, i add 3 links inside my Quick Launch links, each link will have different ContentTypeIdinside its URL. But the problem i am facing is that regardless of the link i click on , the last link will always get bold font weight, and this is confusing users .. For example, if they click to create an item which have ContentTypeId=111, the link which get selected will be the last one with 'ContentTypeId=333'.. so i am not sure if there is a way i can fix this layout issue?

Here is how my quick launch links look like, where the last link is being selected (url = /Lists/Management/NewForm.aspx?ContentTypeId=333&RootFolder=/Management/Lists/Management) although i clicked on the first link (url = /Lists/Management/NewForm.aspx?ContentTypeId=111&RootFolder=/Management/Lists/Management)..

enter image description here

2 Answers 2

2
+50

While configuring the quick launch URLs add a new query string parameter at the end which has the text of the displayed link on quick launch. For example,

/Lists/Management/NewForm.aspx?ContentTypeId=111&RootFolder=/Management/Lists/Management&ct=New Order

Edit the NewForm.aspx page (or master page) and add the below javascript to the page. Remove the jquery reference if you already have one. Modify the code per your requirements

<script  src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
$(document).ready(function(){
var queryString = GetUrlKeyValue('ct');//SharePoint provides this method to get query string value
if(queryString != ''){
$("#sideNavBox span.menu-item-text").each(function(o,i){ 
    if(i.innerText === queryString){ 
$('#sideNavBox a.selected').removeClass('ms-bold');
        $('#sideNavBox a.ms-core-listMenu-selected').removeClass('ms-core-listMenu-selected'); //remove current selected link css
$(this).parent().parent().addClass('ms-bold');
        $(this).parent().parent().addClass('ms-core-listMenu-selected'); //add the selected css to the correct link
        return;
    } 
});
}
});
</script>
10
  • 1
    I should have mentioned this earlier. I tried this code on a SharePoint 2016 on-prem site and it worked fine. You might want to look at the rendered html and css classes in dev tools on the site you have and change the code as needed. Commented Mar 12, 2018 at 23:40
  • 1
    have you tried modifying the NewForm.aspx page directly? Edit the page and add the code inside a script editor web part. Commented Mar 13, 2018 at 15:41
  • 1
    Nice! There are some drawbacks like, when someone modifies the display text of quick launch link, your code will stop working for the changed link. If that is something you are worried about, you need to change the javascript logic to use the content type id, but then everytime you add a content type you should be modifying your code. I suggest you use a content editor web part which links to a file in a SP library which has the js code. Commented Mar 13, 2018 at 16:30
  • 1
    try the innerText or textContent property instead of outerText... Commented Mar 13, 2018 at 17:15
  • 1
    Also, you can use an attribute selector on href: $("#sideNavBox a[href*='ContentTypeId=111']") for the selected one, and $("#sideNavBox a:not([href*='ContentTypeId=111'])") to select all others.
    – wjervis
    Commented Mar 14, 2018 at 12:06
5

This is as per the design.

By default, links in quick launch does not accept query string parameters. when applying the 'selected' style it matches only the url component without parameters.

So all your links will be defaulted to "/Lists/Management/NewForm.aspx" when applying the style and last navigation item will be selected.

As a workaround you can put a script in your masterpage to remove current "selected" style and apply a new style by matching current url and quicklaunch url.

1
  • thanks for the reply. but can you please provide some useful links which can help me in writing a script allow me to remove the current selected style and apply a new style...
    – John John
    Commented Mar 11, 2018 at 14:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.