[Resolved] Search bar to change dropdown options based on first dropdown

[Author]

Posts

[jackC-7]

Hi there,

Is there a way with search when some one has selected an option in the first drop down, the second dropdown will show certain options depending on the first dropdown?

For example:
You choose dropdown A - the second dropdown you get: Option 1, Option 2
You choose dropdown B - the second dropdown you get : Option 3, Option 4, Option 5

Hope this makes sense.

Thanks,
Jack

[Luo Yang]

Dear Jack,

Yes, there is a built-in feature within Views plugin, which is based on post type relationship.

See our demo site:
hidden link

in section "Search Houses", you can choose any option in dropdown "State", the options of dropdown "City" will be changed automatically.

And it is based on post type relationship filter:
- Grandparent post type "State"
- Parent post type "City"
- Child post type "Property"

You can setup your own "Real estate site" demo site here:
https://discover-wp.com/site-templates/

Then check the site settings.

More help:
https://toolset.com/documentation/user-guides/front-page-filters/
https://toolset.com/documentation/user-guides/front-page-filters/advanced-settings-custom-search/

[jackC-7]

Hi there,

Would it be possible if you could log in to the back end and take a look for me?

I have set up 2 Custom Post Types:
Course Overview
Course

The Course should change depending on what Course Overview you choose. I have make a relationship between these posts but still don't seem to be able to work out the search bit...

Thanks,
Jack

[Luo Yang]

Dear Jack,

Please provide your website credentials in below private message box, also point out the problem page URL and view URL, thanks

[Luo Yang]

Thanks for the details, I can login into your website, you are using below post type relationships:

One-to-many relationship between post type "Course Overview" and "Course"

I have edit the post view "course-search-5", as below:
hidden link

1) In section "Content Selection", choose child post type "Courses"
2) in section "Search and Pagination", edit the filter as below:

[wpv-control-post-relationship ancestors="course-overview@course-overview_course.parent" url_param="wpv-relationship-filter"]
<div class="form-group">
	<label>[wpml-string context="wpv-views"]Course Overviews[/wpml-string]</label>
	[wpv-control-post-ancestor type="select" ancestor_type="course-overview@course-overview_course.parent"]
</div>
[/wpv-control-post-relationship]

See screenshot: relationship-filter.JPG

3) In section "Loop Editor", add a content template with below codes:

Course: [wpv-post-link] <br />
Course Overview: [wpv-post-link item="@course-overview_course.parent"]

Test above view in front-end:
hidden link

In the select dropdown menu "Course Overviews", choose option "First Aid", and submit the form, you will be bale to see the related child "Courses" posts.

[jackC-7]

Hi there,

Thanks for doing this!

What I want though is 2 drop down fields, where is the first you would select 'First Aid' then in the second dropdown with the First Aid options. How would you add the second drop down?

Thanks,
Jack

[Minesh]

Luo is on holiday today. He will get in touch with you when he will get back to work tomorrow.

[Luo Yang]

I think there is a misunderstanding:
1) As I mentioned above, in our demo site:
hidden link

There are 3 post types:
- Grandparent post type "State"
- Parent post type "City"
- Child post type "Property"

With two post types relationships:
- one-to-many relationship between "State" and "City"
- one-to-many relationship between "City" and "Property"

So in a post view, you can query "Property" posts, and filter by "State" + "City"

But in your website there is only 2 post types + one post type relationship:
- Parent post type "Course Overview"
- Child post type "Course"

So when you query "Course" posts, there will be only one dropdown menu of "Course Overview".

Hope it is clear.

[jackC-7]

So I need to add a Grandparent post type.

How would I do that if I only need 2 for Course Overview and Courses?

Thanks,
Jack

[Luo Yang]

Dear Jack,

As you can see there isn't such kind of built-in feature within Toolset Views plugin.

And the logic is:
Three post types + two relationships, then setup a post view to query child post, you can filter with two dropdown: parent + grandparent

If there is only two post types + one relationship, then you can only get one dropdown: parent.

Is there any special reason for it:
How would I do that if I only need 2 for Course Overview and Courses?