What is Cascading Drop Down?
You have two columns in your SharePoint list, Country and City. Both are lookup/drop down columns. When you choose a country in the Country Drop Down, you only want to see the cities in this country available in the City Drop Down column. This of course makes life easier for the end user, and improves data quality.
You have two columns in your SharePoint list, Country and City. Both are lookup/drop down columns. When you choose a country in the Country Drop Down, you only want to see the cities in this country available in the City Drop Down column. This of course makes life easier for the end user, and improves data quality.
The solution
Instead, I have used this solution with success. The list is still standard SharePoint, which gives great flexibility and stability. This way, the filtering is done in the forms for creating and editing elements. Because of this, you don’t even have access to the server to implement this. I have used this solution both in document libraries and in regular SharePoint lists.
Instead, I have used this solution with success. The list is still standard SharePoint, which gives great flexibility and stability. This way, the filtering is done in the forms for creating and editing elements. Because of this, you don’t even have access to the server to implement this. I have used this solution both in document libraries and in regular SharePoint lists.
1. Add the Jacascript
Download the Jquery file jquery-1.3.2.min.js by Jquery.com. Download jquery.SPServices-0.4.8.zip from the Jquery Library for SharePoint Codeplex site (newer version is probably also OK). Upload jquery-1.3.2.min.js and jquery.SPServices-0.4.8.min.js (from the zip file) to a document library that everyone accessing your site has access to (a library on the top level site can be wise).
Download the Jquery file jquery-1.3.2.min.js by Jquery.com. Download jquery.SPServices-0.4.8.zip from the Jquery Library for SharePoint Codeplex site (newer version is probably also OK). Upload jquery-1.3.2.min.js and jquery.SPServices-0.4.8.min.js (from the zip file) to a document library that everyone accessing your site has access to (a library on the top level site can be wise).
2. Create your relationship lists
Make two lists, one for the parent Country and one for the Child :
Make two lists, one for the parent Country and one for the Child :
(Country) (City)
The Country column can be a look up from the Countries list, but you can just as well use a standard single line of text column. This can theoretically give better performance, but you must of course be precise when filling out the County column so that the values here matches the ones in the Countries list.
3. Create the list using the Drop Down
Vacation Plans list:
This is the list where I want my Cascading Drop Downs. Country and City are lookup columns against Countries and Cities lists. The lookups goes against the title field in the respective columns.
4. Make the magic happen
In SharePoint Designer, create your own NewForm.aspx (or EditForm.aspx, you’ll need both if you want it to work when editing items).If you don’t know how to do this, I’ll probably post a tutorial later. Tip: don’t edit the existing forms, but copy them and assign them as default forms.
In SharePoint Designer, create your own NewForm.aspx (or EditForm.aspx, you’ll need both if you want it to work when editing items).If you don’t know how to do this, I’ll probably post a tutorial later. Tip: don’t edit the existing forms, but copy them and assign them as default forms.
Just below
insert this code:
NOTE: For this you have to move into Advanced Mode of the page in Page code view side in sharepoint designer.
Save and create a new item using your new form:
