Orchard 1.8 CMS : Cascading dropdowns in Custom Forms module

Question

I'm developing my first Orchard (v1.8) site. I need to implement a form that has cascading dropdowns i.e when the user selects an option from the category dropdown, the items dropdown below that will be populated with items that are of the same category only.

Ideally, the category options will use the category taxonomy that I've added. The category items will be the content items that are of the selected taxonomy term.

I've taken a look at the Custom Forms module but I'm not sure how this can be done and I can't see an obvious way of doing so in the CMS?

This work is part of a custom module I'm writing so if you have any idea how it can be done in C# then that would really help me out.

Answer 1

There is no built-in field that will behave this way, so you'll have to build your own. The field settings, at the content type level, could provide a choice between the taxonomies on the system. The field driver can then retrieve that setting, use the taxonomy service to retrieve the terms, and hand that over to the editor shape for the field. The template for the editor shape can then format that as a drop-down, and wire a change event on that drop-down. When a new term is picked, a script sends an ajax request to a controller action, also provided by the module. The action receives the term's content item id as a parameter, queries the taxonomy service for the items tagged with that term, and sends back a JSON result with the ids and display text of the items. The script on the client-side receives that data and fills a second drop-down with it. On the post editor method of the driver, persist the selected content item into the field's storage.