Streaming live at 10am (PST)

Display CMS item based on a dropdown selection

Hi there,

I’m trying to create a comparison page for items I have in a CMS collection. I’d like to allow the user to select a CMS item in a dropdown and then have the information from the CMS item displayed below.

Is there a way to do this in webflow?

If you want to control page load size you could use a dropdown to load content in another element via an Ajax call in custom code. The other option would be to have all the content loaded on the page but hidden, revealing the correct element on select. At the moment I can’t think of a way to do this without custom code.

Gotcha. I’ve been playing around with some custom code elements. One idea reads CMS item names from a hidden CMS collection to the select field (as shown in this video:

However, populating data on the same page is proving more difficult. I’d like to be able to say, “if dropdown = CMS name ‘x’, then display values ‘a’, ‘b’, ‘c’.”

I recently shared a demo of using a collection list with buttons, loading more details from a collection template page for an item via Ajax. It was built as a proof of concept and you should be able to use it as a model for your particular use case.

That’s a logic issue that can be solved by having the data in the collection item that code can grab the values for and then be used.