This project has moved and is read-only. For the latest updates, please go here.

SPCascadeDropDown Setup

Jun 9, 2010 at 3:43 PM
Edited Jun 9, 2010 at 3:43 PM

I tried to implement SPCascadeDropDown for three lists, Region, State and Cities. But I am not able to get it to run.

In output form (which is a new List named Locations), I only see the three fields acting like regular Lookups.

I believe that javascript is not running in my case, let me know how to make the script run.

I have uploaded the javacript files in the exact way as your demo example.

I still don't get it how would it make the jQuery.SPServices-0.5.5 and jQuery.SPServices-0.5.5.min run? where should I give reference for them??

and where shall I keep CadcadingDropdowns.js  and what content should be there in it apart from relationshipList name and its parent and child and parentcolumn and childcolumn??


Please please let me know.

Jun 9, 2010 at 4:02 PM

Try reading thorugh hte documentation here:

The most ocmmon problem people have is just getting the references to the .js files right.  Add an alert into your (document).ready function. If it fires, then you've got things set up correctly.


Jun 9, 2010 at 7:10 PM

Thanks for the quick response..
i tried putting alert box, they popped up also.
Now i have enabled debug mode and it gives me an error message:

Error in function: SPCascadeDropdowns
Parameter: parentColumn: Region
Message: Column not found on page

I believe that this is something you must have encountered before.. Please let me know as soon as possible.

Thanks a tonn.

Jun 9, 2010 at 7:48 PM

If you're getting that modal popup, then you don't actually have a parentColumn in the form called Region.  Which form are you adding the jQuery to?


Jun 9, 2010 at 8:08 PM
Edited Jun 9, 2010 at 8:09 PM

I am writing the below mentioned code in the Source Editor of a 'Content Editor Web Part ', which I am keeping on the same page as the 'Locations' List's.

<script language="javascript" type="text/javascript" src="http://sdmsaw01:28018/demo/Internal/documentTracker/jQuery%20Files/jquery-1.4.2.js"></script>

<script language="javascript" type="text/javascript" src="http://sdmsaw01:28018/demo/Internal/documentTracker/jQuery%20Files/jquery.SPServices-0.5.5.min.js"></script>

<script language="javascript" type="text/javascript">
$(document).ready(function() {
alert('Inside the Function')
  relationshipList: "States",
  relationshipListParentColumn: "Region",
  relationshipListChildColumn: "State",
  parentColumn: "Region",
  childColumn: "State",
  relationshipList: "Cities",
  relationshipListParentColumn: "State",
  relationshipListChildColumn: "City",
  parentColumn: "State",
  childColumn: "City",

This is the Page where I am keeping the Locations List and The content editor Web Part: http://sdmsaw01:28018/demo/Internal/documentTracker/Lists/Locations/AllItems.aspx?PageView=Shared

Alll other relationshipLists are on their seperate Pages (States List and Cities List) (And a Regions List which serves as a Lookup for Region Column of Locations List)

Am I doing it wrong? I really appreciate your efforts. Thank you so much


Jun 9, 2010 at 8:19 PM

You're adding the script to the AllItems view rather than the form(s) for the list.  There isn't anything to "drop down" in the All Items view.  If you want the functionality in the forms, you'll need to add it to them (NewForm.aspx and/or EditForm.aspx) instead. I *always* take a copy of the forms and edit the copies. This is all spelled out in the documention I linked to above.


Jun 9, 2010 at 8:37 PM

I totally get it now what you are saying, but I don't know how to implement it.

I apologize for my lack of knowledge in sharepoint. I have started working on sharepoint very recently and I really want to extend the current website's functionality using your SPServices.

I request you to walk me through the process. Here's what I have got::

Regions, States, Cities and Locations List.

Now, I was doing all the jQuery in Locations List's Page, but that's wrong. I got that. I'll need to add this functionality to /Locations/NewForm.aspx or /Locations/EditForm.aspx .

But when I get into either of those two pages, I do not have 'Edit Page' option under 'Site Actions' tab, so where should I enter the whole jQuery Code (the one where I give reference to .js files and specify the parentColumn etc..) ?

I again apologize for inconvenience caused to you. But this is what I really want to get implemented. I'll keep working on it.

Let me know.


Jun 9, 2010 at 8:49 PM

No problem.  Asking the questions is fine!

To add new Web Parts to the default forms, like a CEWP, add ?toolpanelview=2 to the URL for the page. So, for instance:



Jun 9, 2010 at 8:59 PM


I am yet not able to have the 'Edit Page' button under 'Site Actions' tab for /Locations/NewForm.aspx?toolpanelview=2


Jun 9, 2010 at 9:24 PM

it worked on adding: ?RootFolder..&Source=%uffd&ToolPaneView=2


Thank You so much for your time and effort and ofcourse such a wonderful package.

I have now implemented it using CEWP, I want to implement it by the PlaceHolder Approach tomorrow.

You've mentioned about copying NewForm.aspx and renaming the Copy to NewCustomForm.aspx and then adding jQuery to it and then renaming it back.

I still don't get how to copy the page and where to write code for new page if not in CEWP ?

I request you to take me out of all these confusions.

P.S: I do have a strong programming background, it's just that I am totally new to SharePoint. [ 10 days old ] & yet to explore it all.

Jun 10, 2010 at 3:25 AM

Sorry about my typing mistake above, but you got around it. You'll need to use SharePoint Designer to copy the form page and put the script directly into the page.


Jun 10, 2010 at 2:51 PM

Ok, Thanks

I do have one other requirement. I was wondering you could help me get around it too.

I want to have a form, but unlike the previous one I'll have 3 Text Fields to be filled automatically according to the selection of one drop down list.

so for instance,

NAME: DropDownList  [User makes selection on this field]

Address: Text Box [gets populated according to the selected Name]

Phone Number: Text Box [gets Populated according to the selected Name]

Similarly, Email Address :Text Box [gets Populated according to the selected Name]

As relationshipList I would have one list 'UserDetail' which will have Name, Address, PhNo, Email, Title, Department, etc....

I hope I have clearly stated the requirements.

I understand that modifications would be in the .js file, as instead of Dropdowns, now it would be Single Line of Text.

I request you to guide me through this. Thanks again


Jun 10, 2010 at 3:46 PM


I just encountered an issue with jQuery SPServices cascading Drop downs.

I would like you to have a look at it.

the jQuery doesn't work in 'Edit in Datasheet View'. I understand it is a different page so it would need a new CEWP with the same jQuery code. I did that too, but now it gives an error saying parentColumn not found. Is this happening because in Datasheet view column names are no longer Dropdowns?

For my case this seems to be a big issue, please have a look at it and let me know the approach to solve this.

Thank you so much.

Jun 10, 2010 at 6:53 PM

None of the functions in SPServices are built to work in Datasheet view.  Datasheet view exposes a totally different type of page to the user.


Jun 16, 2010 at 2:23 PM

oh ok. Got it.

But it doesnt seem to be a Problem to me now...

Thank you so much for your time and knowledge..

Jul 30, 2010 at 10:31 AM
Edited Jul 30, 2010 at 10:42 AM

Hi Marc,

First, is the gridview the same thing as the datasheet view?

My cascading dropdown list works perfectly well when I want to add elements one by one. But I would like to know if it could be possible to do the same thing (in reference to the first few post in this subject) in the grid view.

In fact, in the project i am working on, I need to be able to add a lot of items to my list so I would like to have the cascading dropdown system working in the grid view mode.

I hope I am clear enough (my english is not perfect at all!).



Aug 2, 2010 at 2:14 AM


SPCascadeDropdowns is built to work with the default form DOM structures, so if you are using your own griview, it won't be of any use to you.