0

In my UI I have a dropdown which contains some values: A, B, C. There is also another dropdown in the page whose values depend on the selected value in the first combo.

If I select A in the first field I need to display A1, A2, .... An options in the second.

If I select B in the first field I need to display B1, B2, B3, ..... Bm options in the second and so on.

The first combo is from a <Field type="Choice" />.

How can I manage this situation? Can I create another field for the second combo (A1, A2, .... An + B1, B2, B3, ..... Bm) and somehow filter them? Can I use lists instead and join them somehow?

Plus, I need to make this work in the client side (with javascript/jQuery) without performing extra requests to get the values.

What is the prefered way to handle this situation in SharePoint 2010?

Improve this question

2 Answers 2

Reset to default
5

You can do it in InfoPath, cascading drop downs. But since you said you need to do it in jQuery, there is a very useful library, called SPServices, available to assist. Marc has created a function in the library to do cascading drop downs, which is exactly what you want.

Look over that information and see if it's helpful.

Improve this answer
5
  • Thanks for the answer but I would like to avoid going to the server for the elements in the second dropdown and keep it on the client side. The library you mention makes AJAX requests to fill the second dropdown. I've edited my question to specify this more clearely.
    – JohnDoDo
    Nov 2, 2011 at 14:20
  • 1
    It isn't resource intensive and performs well. It does make an AJAX call to fetch the data to populate the dropdown, but it's still all client side script.
    – Eric Alexander
    Nov 2, 2011 at 14:29
  • You can do it in InfoPath, cascading drop downs. Can you detail this a little bit please? I never worked with InfoPath and I'm new to SharePoint... heck of a combination :-)
    – JohnDoDo
    Nov 4, 2011 at 8:33
  • 1
    InfoPath use isn't high here so I can't speak from experience, here are a couple web examples: nothingbutsharepoint.com/sites/eusp/Pages/… and koobarspoint.blogspot.com/2010/06/…
    – Eric Alexander
    Nov 4, 2011 at 12:02
  • I'm going to try this with InfoPath. If performance degrades I'll use a custom web part that loads the list on open than manage the cascading with jQuery.
    – JohnDoDo
    Nov 7, 2011 at 13:52
2

Since you don't want to perform extra requests to get the values, it means that the relationship between the two fields must be present somewhere in the form page.

The way to do this would be to store this relationship in a SharePoint list:

|Title | Choice |

| A1 | A |

| B1 | B |

etc.

Add this list as a Web Part, hidden below your form. Then everytime a choice is selected in the parent (A, B, C) read the hidden list with JavaScript/jQuery and update the second combo accordingly.

I am afraid you won't find sample code for this, because people usually find AJAX requests just fine. Such a customization represents a lot of effort, and as PirateEric mentions a library like SPServices does the job for you. In my SP 2010 customizations, I prefer to use REST services because they are supposedly more efficient, but the idea is the same and requires at least one AJAX request.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.