Cascading Drop down In SharePoint Lists using jQuery

Out-of-the-box SharePoint doesn't provide a way to cascade drop downs in list forms. Luckily, jQuery provides a way to implement cascading drop downs in SharePoint list forms. Here is the step by step implementation guide:

We need to have two more lists to implement this. Lets say:

List 1: Parent list, say: Country

List 2: Child list, say: Cities

List 3: Our target list, where we are going to implement the Cascading drop down.

So, Now:

1. Download the jquery-1.3.2.min.js by Jquery.com, from the below link
 http://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.3.2.min.js

2. Download spservices (jquery.SPServices-0.5.6.min.js) from the codeplex link
http://spservices.codeplex.com/

3. After downloading upload these two files in a document library

4. In SharePoint Designer, create your own NewForm.aspx (and EditForm.aspx)

Insert the following code: Just below 

<asp:Content ContentPlaceHolderId="PlaceHolderMain" runat="server">

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<script language="javascript" type="text/javascript" src="/address to document library/jquery-1.3.2.min.js"></script> <script language="javascript" type="text/javascript" src="/address to document library/jquery.SPServices-0.4.8.min.js"></script> <script language="javascript" type="text/javascript">  $(document).ready(function() {   $().SPServices.SPCascadeDropdowns({    relationshipList: "Cities",    relationshipListParentColumn: "Country",    relationshipListChildColumn: "Title",    parentColumn: "Country",    childColumn: "City",    debug: true   });  }); </script>

Here:

• relationshipList: “Cities” : this is the name of the relationsship list = the list containing parent and child
• relationshipListParentColumn: “Country” : Column name from the Cities list
• relationshipListChildColumn: “Title” : Column name from the Cities list
• parentColumn: “Country”: Column name from the list where the drop down is = Vacation Plans
• childColumn: “City”: Column name from the list where the drop down is = Vacation Plans

Demo: http://www.sympraxisconsulting.com/Demos/Demo%20Pages/CascadingDropdowns.aspx

Cascading drop down example- What you will get as output is: 

Verified that, cascading dropdown list method works on both SharePoint 2007 and SharePoint 2010

Reference:
http://www.sharepointdiary.com/2011/01/cascading-drop-down-using-jquery.html