New & Improved Cascading Dropdowns for SharePoint Classic Forms

Almost three years ago I posted a script on how to create cascading drop downs for SharePoint 2013 and SharePoint Online using REST.

Cascading Drop Down Lists in SharePoint / Office 365 using REST

Since then I’ve had a lot of comments asking for additional functionality to that script. So, I decided it was time to update the script and make it a little more modular. If you are a user of the previous script, the biggest change you will see is how you execute the cascade function. Now, instead of passing in an object to the cascade functionality, you pass in an array of objects. This allows you to set up multilevel cascading.The updated script can be found on GitHub at https://github.com/mrackley/HillbillyCascade

var cascadeArray = new Array();

cascadeArray.push({

    parentFormField: "<display name>", //Display name on form of field from parent list

    childList: "<list name>", //List name of child list

    childLookupField: "<internal name>", //Internal field name in Child List used in lookup

    childFormField: "<display name>", //Display name on form of the child field

    parentFieldInChildList: "<internal name>", //Internal field name in Child List of the parent field

    firstOptionText: "< text >"

});

$().HillbillyCascade(cascadeArray);

As always, take a look at the video at the end of the blog post for step by step instructions and to see the script in action.

Updated Features

  • Multiple cascades – In the previous script, it only worked for one level. In the updated script you can have as many levels as you’d like. All you need to do is create a new cascade object and add it to the array.
  • New and Edit Form – The updated script works well on both new and edit forms.
  • Default text for unselected dropdown – You now specify what you want the text of the select to be if nothing has been selected yet

And just like the previous script, you can update the REST query to work with 2010. This solution “as is” will work on SharePoint 2013, 2016, and SharePoint Online for Classic Forms. If you are using the new Modern Forms you cannot customize those forms. You’ll need to look at using something like StratusForms with a SPFx Client Web Part.

The Video

As promised, the below video shows you how to implement the script found in GitHub. In the video, I’m using Office 365 and have a 2 level cascade (State->County->City).

The other stuff

There have been a LOT of requests around this script including debugging questions from those who have not been able to implement it correctly. Unfortunately, I simply do not have the time to respond to all of these emails. If you are having issues with the script, I strongly urge you to implement the list structure that I’m using in the video and see if you can make things work as is. It is CRITICAL you use correctly entered List Names, Display Field Names, and Internal Field names where indicated or it simply won’t work.

Anyway, I hope you like the updates! Thanks once more for stopping by.

12 Comments

  1. Very nice work for single-choice cascades… Can you put together something for when “Allow multiple values” is set? It works for the initial filtering, but if you remove an item from the choices it allows them ALL to be seen.

    • Considered doing that, just hard to find the time to make it work for all scenarios.. if you’d like to contract with my company to do this I’d be happy to assign a resource to get it done.

  2. I have the cascading working, but the results are limited to 100 values and not sorted. Any thoughts how I can ensure all of the values are returned and sorted? (I’m parent is company, and child is employee name)

    how add the $top parameter to the query?

    thanks for your help

    • hmmm… Historically quick edit views are not easy to work with, but I haven’t tried lately… I’ll dig into when I have some time.

  3. Hi, I have 2 sets of groups, one for countries (3 menus) and the other for company sections (also 3 menus).
    apparently like this, it will not work. there is some conflict with 2 groups while selecting.

    please assist me in solving it.

  4. I have the same question as Mahmoud. I have 2 groups I’m attempting to utilize this solution for. Unfortunately, when selecting the first, it resets the second. Does anyone have a solution for this?

  5. Mark – wondering if you wouldn’t mind commenting on the following. My colleague used your solution and demo’d it to me and it worked in modern team sites in a modern library. The only thing that happened is that when the item is in edit mode, it reverts back to classic…but upon saving, the library appears in modern mode again. Is this what you mean by “not working” or should we be seeing a different experience?

6 Trackbacks / Pingbacks

  1. Episode 121 with Richard Moe on Microsoft Teams Extensibility—Office 365 Developer Podcast | Com-Tech of Miami, Inc.
  2. Episode 121 with Richard Moe on Microsoft Teams Extensibility—Office 365 Developer Podcast | | www.office.com/setup
  3. Episode 121 with Richard Moe on Microsoft Teams Extensibility—Office 365 Developer Podcast | X-Vision IT Consulting GmbH
  4. Episode 121 with Richard Moe on Microsoft Teams Extensibility—Office 365 Developer Podcast – Rescue IT
  5. Episode 121 with Richard Moe on Microsoft Teams Extensibility—Office 365 Developer Podcast | Alt-Tech Inc.
  6. SharePoint Improves Office 365 Home; Microsoft Teams Launching Soon; SharePoint Security and PowerShell

Comments are closed.