How to add cascading dropdown in SharePoint form

  • Article

Writing fully custom solution only because there is need of cascading dropdown ? . You can achieve this in exiting sharepoint new or edit form. Follow below given steps

 

 

  • Create a list name “Site”

**       **

  • Create another list name “Department”, Add look up column name “Site’ in “department list. ( Kindly select ID while setting up lookup column)

        

        

  • Add “Site” and “Department” as lookup columns in list where cascading dropdown is required.

        

  • Open default new form page in web part mode

        

  • Add content editor webpart, open html source.

        

  • Add following code in html source

<script src="/Style Library/js/jquery-1.7.2.min.js" type="text/javascript"></script>

<script src="/Style%20Library/js/jquery.SPServices-0.7.1a.min.js" type="text/javascript"></script>

<script type="text/javascript">

$( document ).ready(function() {

**            $().SPServices.SPCascadeDropdowns({**

**            relationshipList: "Department",**

**            relationshipListParentColumn: "Site",**

**            relationshipListChildColumn: "Title",**

**            relationshipListSortColumn: "ID",**

**            parentColumn: "Site",**

**            childColumn: "Department",**

**            promptText: "Choose Department...",**

**            debug: true**

**    });**

});

  • Save page.

  • This will add cascading dropdowns in New form. Departments will load on selecting site.