Cascade Dropdowns

Mar 26, 2010 at 2:18 PM

Good morning Marc.

I've followed your guide (minus some pluralisations) on the Cascade Dropdown page.  I'm running into issues getting the dropdows to actually cascade.  I created a sample list that uses lookup columns to the Country/Region/State lists.  When I try to add a new item, SpServices is yelling at me that Country does not appear on the page.

My code lookes like

<script language="javascript" type="text/javascript" src="http://150.216.2.26/sites/ericrules/cascade2/SPServices/jquery-1.4.2.min.js"></script>
<script language="javascript" type="text/javascript" src="http://150.216.2.26/sites/ericrules/cascade2/SPServices/jquery.SPServices-0.5.3.min.js"></script>

<script language="javascript" type="text/javascript">
	$(document).ready(function() {
		$().SPServices.SPCascadeDropdowns({
			relationshipList: "Region",
			relationshipListParentColumn: "Country",
			relationshipListChildColumn: "Title",
			parentColumn: "Country",
			childColumn: "Region",
			debug: true
		});
		$().SPServices.SPCascadeDropdowns({
			relationshipList: "State",
			relationshipListParentColumn: "Region",
			relationshipListChildColumn: "State",
			relationshipListSortColumn: "ID",
			parentColumn: "Region",
			childColumn: "State"
		});
	});
</script>
Coordinator
Mar 26, 2010 at 2:21 PM

Eric,


My first suggestion would be to remove the second cascade until we get the first one working. One less thing to mess with.

As mark suggested put an alert just inside the document.ready tag so we can make sure it's firing.

alert('ready call');

Coordinator
Mar 26, 2010 at 2:22 PM

Hard to do this in 140. ;+)

So does the list where you want to do the cascades have a column named "Country" which is a Lookup column to the 'Country' column in the 'Region' list?  And which page do you have the script above on?  (e.g., EditFormCustom.aspx)

M.

Mar 26, 2010 at 2:24 PM

It's firing as expected since I'm getting the SPServices debug error.

I removed the second condition and the error persists.

Mar 26, 2010 at 2:26 PM
sympmarc wrote:

Hard to do this in 140. ;+)

So does the list where you want to do the cascades have a column named "Country" which is a Lookup column to the 'Country' column in the 'Region' list?  And which page do you have the script above on?  (e.g., EditFormCustom.aspx)

M.

 The input list has a column named Your Country which is a lookup to the Country list, Title column.  I figured a name collision would occur here if I named it Country.  Did I assume wrong?  I have it embedded in a CEWP on the default NewForm.aspx page.

Coordinator
Mar 26, 2010 at 2:28 PM

If it's 'Your Country', then change the script to this:

$().SPServices.SPCascadeDropdowns({
  relationshipList: "Region",
  relationshipListParentColumn: "Country",
  relationshipListChildColumn: "Title",
  parentColumn: "Your Country",
  childColumn: "Region",
  debug: true
});

The column names have to match what you have on the page. ;+)

No, you wouldn't have naming issues.

M.

Mar 26, 2010 at 2:44 PM

OK, doing just that function throws no errors, but it isn't limiting the values in the dropdown. 

When I introduce the second function it errs that Region is invalid.

$().SPServices.SPCascadeDropdowns({
	relationshipList: "State",
	relationshipListParentColumn: "Region",
	relationshipListChildColumn: "State",
	relationshipListSortColumn: "ID",
	parentColumn: "Your Region",
	childColumn: "State"
		});
	});
Coordinator
Mar 26, 2010 at 2:48 PM

So the State list, has a column called Region, and a column called State, your form has a dropdown called "Your Region", and a dropdown called "State", correct?

If that's correct, we may need to look at how your State list is built.

Coordinator
Mar 26, 2010 at 2:49 PM
Edited Mar 26, 2010 at 2:52 PM

Let's stick with just the first one until we get it running. So, you should have this and you're seeing no errors?

<script language="javascript" type="text/javascript" src="http://150.216.2.26/sites/ericrules/cascade2/SPServices/jquery-1.4.2.min.js"></script>
<script language="javascript" type="text/javascript" src="http://150.216.2.26/sites/ericrules/cascade2/SPServices/jquery.SPServices-0.5.3.min.js"></script>

<script language="javascript" type="text/javascript">
	$(document).ready(function() {
		$().SPServices.SPCascadeDropdowns({
			relationshipList: "Region",
			relationshipListParentColumn: "Country",
			relationshipListChildColumn: "Title",
			parentColumn: "Your Country",
			childColumn: "Region",
			debug: true
		});
	});
</script>

Now, in the Region list, you've got two columns (at least):

  • Title: contains the name of the Region
  • Country: Contains the name of the Country, and is a Lookup column the the Title column in a list called Countries

Countries has one column (Title) which contains the name of the Country.

In your "host list" (where you want the cascading), you should have

  • a column called 'Your Country', which is a Lookup column to the Title in Countries
  • a column called 'Region', which is a Lookup column to the Title column in Region

M.

Mar 26, 2010 at 2:55 PM

Setup is:

  • Country list has just Title.
  • Region list has Title and Country which is a look up to Country, Title column.
  • State list has Title, Abbrev, and Region Name which is a lookup to the title column of the Region list.  These were mimmicked from the example on the Cascade Dropdown page.
  • My intake list contains Title, Your Country (lookup to Country list, Title Column), Your Region (Lookup to Region list, Title Column), and Your State (Lookup to State List, Title Column)
Coordinator
Mar 26, 2010 at 3:19 PM

Then:

<script language="javascript" type="text/javascript" src="http://150.216.2.26/sites/ericrules/cascade2/SPServices/jquery-1.4.2.min.js"></script>
<script language="javascript" type="text/javascript" src="http://150.216.2.26/sites/ericrules/cascade2/SPServices/jquery.SPServices-0.5.3.min.js"></script>

<script language="javascript" type="text/javascript">
  $(document).ready(function() {
    $().SPServices.SPCascadeDropdowns({
      relationshipList: "Region",
      relationshipListParentColumn: "Country",
      relationshipListChildColumn: "Title",
      parentColumn: "Your Country",
      childColumn: "Your Region",
      debug: true
  });
});
</script>

Mar 26, 2010 at 3:27 PM

We are getting close but the initial cascade is not right.  I receive an error RelationListParentColumn : Country or RelationListCHildColumn: Title not found in RelationList Region.  I am now seeing the Your Region and Your State drop downs populated with Choose Your Region... and Choose Your State... which is coming from SPServices correct?  I'm not sure why it's erring.  I've confirmed those are the correct values.

<script language="javascript" type="text/javascript" src="http://150.216.2.26/sites/ericrules/cascade2/SPServices/jquery-1.4.2.min.js"></script>
<script language="javascript" type="text/javascript" src="http://150.216.2.26/sites/ericrules/cascade2/SPServices/jquery.SPServices-0.5.3.min.js"></script>

<script language="javascript" type="text/javascript">
	$(document).ready(function() {
		$().SPServices.SPCascadeDropdowns({
			relationshipList: "Region",
			relationshipListParentColumn: "Country",
			relationshipListChildColumn: "Title",
			parentColumn: "Your Country",
			childColumn: "Your Region",
			debug: true
		});
$().SPServices.SPCascadeDropdowns({
			relationshipList: "State",
			relationshipListParentColumn: "Region_x0020_Name",
			relationshipListChildColumn: "Title",
			relationshipListSortColumn: "ID",
			parentColumn: "Your Region",
			childColumn: "Your State"
		});
	});
</script>

Coordinator
Mar 26, 2010 at 3:33 PM

Still think you're better off if you get one running without the other first.

That error is saying that

RelationListParentColumn : Country or RelationListCHildColumn: Title
not found in RelationshipList Region

So, are the internal names (StaticNames) for the two columns actually 'Title' and 'Country'?  Or have you used 'Your Country' or something? (Which would have a StaticName of 'Your_x0020_Country'.)

relationshipListParentColumn and relationshipListChildColumn need to be the StaticNames; parentColumn and childColumn need to be the DisplayNames

(Just like it says in the documentation.) ;+)

M.

Mar 26, 2010 at 3:42 PM

Yes, the Static names on the Region list are Title and Country as well as their display names.  I've verified that by going into the List settings and mousing over the columns and seeing the Field= value.

That's why I updated the second cascade to be Region_x0020_Name since that's what I created it as, after reading the documentation.  I just dont understand why it's erring.

Coordinator
Mar 26, 2010 at 3:44 PM

Send me screenshots of the AllItems views of each list: marc dotto anderson atta sympraxisconsulting dotta com.

M.

Mar 26, 2010 at 4:06 PM

Seems to be working correctly now, been having some weird DNS issues in the test/dev environment all day that were probably impacting this.  It became unaccessable today via it's normal URL but accessible via IP, that's why it was in my code.  The site was throwing an unknown error at me by IP address so I went back in by domain name, updated the script to the domain name, and now it's working.

If you could, I'd suggest updating the example to be reflective of the screenshot examples when time permits.  That would help show the differences in how each setting should work based on the screenies provided.

Thanks to the both of you for assisting with this.  It will be handy in an upcoming project.

eric

Coordinator
Mar 26, 2010 at 4:12 PM

Great.  I'll take a run through the docs again.  I've revised them a million times (it seems!).  To me the screenies and the example match. What in particular do you see as a disconnect?

Maybe it would help to have some annotated screenies so that people can more easily see what I'm talking about.  And a video might help, too.

Now that you've got it set up, I think you'd agree it's pretty straightforward. There's just a bit of a hurdle that lots of people seem to struggle with.

M.

Mar 26, 2010 at 4:26 PM

I feel it's the States list showing Region Name but the example code further down the page not reflecting that the static name would be Region_X0020_Name.  That would show a bit better the difference between the display name and the static name.

Yes, it is pretty straight forward now that I understand how it's working.  It's the understanding and piecing the code together with the screenshots.  Maybe colored boxes around the particular areas in the screenshots and a commented example code that referenced the colored sections would bring it together quicker for people.

Coordinator
Mar 28, 2010 at 12:46 AM

p.s. You should use relative addressing for the script src in all cases. (Relative links are always preferable.)  This keeps you "safe" in case the servername changes, DNS issues, etc

<script language="javascript" type="text/javascript" src="/sites/ericrules/cascade2/SPServices/jquery-1.4.2.min.js"></script>
<script language="javascript" type="text/javascript" src="/sites/ericrules/cascade2/SPServices/jquery.SPServices-0.5.3.min.js"></script>

Oct 26, 2010 at 8:36 PM

Good Afternoon Marc,

I am having a little trouble using your solution as well.  I put it all in and when I pick a parent from the dropdown the child choices are displayed using the jquery code.  My issue is once I choose the child from the set of choices it overrides the parent choice with the child choice instead of selecting the child choice in the right menu.  Got any ideas?

Thanks,
Dave

Oct 26, 2010 at 9:05 PM

never mind marc.  I found my issue.  I had a case sensitive issue

Coordinator
Oct 27, 2010 at 12:57 AM

David:

Glad you got it sorted! Post back if you need anything else. Usually it's best to start a new thread.

M.

Oct 29, 2010 at 4:22 PM

Hello,

  This is my first question posted on Codeplex so the questions may seem a bit silly.  I have set up some test lists similar to your example showing Region, Country, State; but i can't get the tool to work.  I have tried adding a content editor webpart to the new form page and i have also imbedded it on the master page but no luck.  Here are my lists: Countries; Regions; States..  I am adding this to TestCascade list that only has a "title" box.. is this the way you intended it to work?  Can you see anything obvious that I may be missing?

Here's my script My script

<script language="javascript" type="text/javascript" src="../js/jquery-1.4.3.min.js"></script>
<script language="javascript" type="text/javascript" src="../js/jquery.SPServices-0.5.7.min.js"></script>

<script language="javascript" type="text/javascript">
$(document).ready(function() {

  $().SPServices.SPCascadeDropdowns({
   relationshipList: "Regions",
   relationshipListParentColumn: "Country",
   relationshipListChildColumn: "Title",
   parentColumn: "Country",
   childColumn: "Region",
   debug: true
 
});
});


</script>

Coordinator
Oct 29, 2010 at 4:38 PM

When you say it doesn't work, what happens when the page loads? Any messages? errors?

M.

Oct 29, 2010 at 4:42 PM

I get no errors or messages in IE but when i look in Firefox - Firebug I get a "Break on Error" stating $().SPServices is undefined when embedded on the master page. 

Coordinator
Oct 29, 2010 at 4:46 PM

Ok, then your reference to the SPServices .js file isn't right. You'll need to check that. Remember that the ../ notation needs to make sense in a relative sense from the page you are loading it in.

M.

Oct 29, 2010 at 9:16 PM

Thanks for that.  It's the first time I've added into a form so forgot to take that into consideration.  So i have built this into my solution with 7 lookup items.  It seems to be filtering but there are some quirks.  It's not providing dropdown boxes and it is also repeating the same options instead of showing all the selections available.  For example, if the Parent is Fruit and child is Type of fruit, instead of providing apples, oranges, and bannas it gives apples, apples, apples.  Thoughts?

Coordinator
Oct 29, 2010 at 11:45 PM
Are your relationshipLists really relational? It sounds like you probably have duplicate items in your lists. I'd suggest getting one or two working rather than going whole hog with 7 right away. M.
Oct 30, 2010 at 2:53 AM
Edited Oct 30, 2010 at 3:53 AM

My data should be relational but i could be missing something.  I have regions (contains:Americas, Japan, Europe) then i have sub regions (US, Canada, Mexico, Japan-1, Japan-2, Europe-1, Europe-2)...  Americas should only allow Canada, US, and Mexico but does not.   

Coordinator
Oct 30, 2010 at 12:44 PM
What do you mean when you say that the columns aren't showing up as dropdowns? Before you add any script at all to the page, the columns ought to be dropdowns. They will be dropdowns because they are Lookup columns into your relationship lists. (In your case, these lists probably ought to be the basis for Site Columns in the root of the Site Collection because you are likely to want to use them in many places.) M.
Oct 31, 2010 at 10:57 PM

Okay. Had to recreate the lists and now everything is showing as dropdowns or selector (for multiple). I’m having trouble understanding how to correctly place the lists together to get the relationship to appear. I’m attaching a picture to explain. If you view the attachment, you’ll see that I have Americas selected and there are 8 options which happen to occur in the US sub region. The problem I’m having is that it’s listing 8 “US’” instead of just a single US. I’ve confirmed that there are no errors in the script so I’m assuming this has something to do with how I’m relating my info. I now have “Regions” (title only) and “SubRegions”(title only) and I’m running into the same type of scenario as I had before when using “Subregions” (Title and Regions) columns. If you were trying to cascade sub regions and regions how would you set up your tables?

Would you have it like this?

List A - Category 1 : (title only) (my regions)

List B - Category 2: (Title and look up to Category 1) (my subregions)

List C –Category 3: (Title, look up to Category 1 and Category 2 and insert the SPservices script on this list? (my cities)

Dennis Sanders

Dell | CSMB Operations

1-800-822-8965, ext 7243037

Office Hours of Operation 8:00am-5:00pm (CST)

How am I doing? E-mail my manager Heather Neville

CONFIDENTIALITY NOTICE: This e-mail message, including any attachments, is for the sole use of the intended recipient(s) and may contain confidential or proprietary information.

Any unauthorized review, use, disclosure or distribution is prohibited. If you are not the intended recipient, immediately contact the sender by reply e-mail and destroy all copies of the original message.

From: sympmarc [mailto:notifications@codeplex.com]
Sent: Saturday, October 30, 2010 7:44 AM
To: Sanders, Dennis A
Subject: Re: Cascade Dropdowns [SPServices:207422]

From: sympmarc

What do you mean when you say that the columns aren't showing up as dropdowns? Before you add any script at all to the page, the columns ought to be dropdowns. They will be dropdowns because they are Lookup columns into your relationship lists. (In your case, these lists probably ought to be the basis for Site Columns in the root of the Site Collection because you are likely to want to use them in many places.) M.

Read the full discussion online.

To add a post to this discussion, reply to this email (SPServices@discussions.codeplex.com)

To start a new discussion for this project, email SPServices@discussions.codeplex.com

You are receiving this email because you subscribed to this discussion on CodePlex. You can unsubscribe on CodePlex.com.

Please note: Images and attachments will be removed from emails. Any posts to this discussion will also be available online at CodePlex.com

Coordinator
Nov 1, 2010 at 12:42 AM
Edited Nov 1, 2010 at 12:46 AM

Dennis:

Unfortunately, your picture didn't make it through. Take another look at the $().SPServices.SPCascadeDropdowns documentation page. There, you can see how I set up my Countries, Regions, and States lists. Each of those three lists is used to make the cascading shown at the bottom of the page work in a fourth page, using those relationship lists as the fodder for SPCascadeDropdowns. I've just added a little more text to the doc page to (hopefully) make it a little clearer.

This function totally throws some people for a loop, and others pick it up right away. It generally has to do with what experience the person has with relational data tables. If you have someone who has that sort of experience who could read through the docs with you, it might help.

M.

Nov 1, 2010 at 2:26 PM

I got it!  I took what you mentioned to heart and realized where i went wrong.  On my final list I had the relational data correct but my problem was that in the code i was referencing the same list all 7 times thinking i needed to use the name of the list that combined all the options.  Not sure why it took me so long but after relizing this i set it up to show "relationshiplist 1" ; "relationshiplist 2"; "relationship list 3"; and so on.  I now have it working and appreciate you help with this.  I love the script and look forward to using the others in future projects.  Thanks again!

Coordinator
Nov 1, 2010 at 4:02 PM

Excellent! Gotta love those 'Aha!' moments.

M.