Can a gallery be filtered by a dropdown and no submit button?

Thanks for your question and for posting the complete text of your shortcodes; very helpful. Combining a dropdown control with a gallery display is a popular topic.

Here’s a recent topic that shows how to filter an [mla_term_list] to show children and to pass the selection to an [mla_gallery]:

Not working…ugggg!

You’ll have to change the flat format to mla_output=dropdown but the other elements of the solution should apply. Note the use of term_id and slug in different parts of the solution.

Here’s an earlier topic that shows how to use a bit of script to avoid the submit button:

Creating a dropdown list of PDF files

Here’s an earlier topic that includes the onchange function in a different context:

Dynamic search and filters

Once you get the basics working you will find that the dropdown selection doesn’t “stick” when the page is refreshed. You might want to look into the “MLA UI Elements Example” plugin and the support topics that inspired it. Go to the Settings/Media Library Assistant Documentation tab and click the “Example plugins” button. Find the “MLA UI Elements Example” plugin and click the “View” rollover action to see a summary of its features and a list of support topics that use it.

I hope that gets you started on a solution for your application. I am marking this topic resolved, but please update it if you have problems or further questions regarding the above suggestions. You will see that there are endless variations on the basic solution and I’m happy to give you more specific help if you need it. Thanks for your interest in the plugin.

David, thanks once again for all that you do. I’m not quite getting it yet:

I can render a dropdown list with just the children of the parent category grilling-accessories using [mla-term-list] : [mla_term_list taxonomy=attachment_category parent=82 mla_output=dropdown mla_link_href='{+page_url+}?current_item={+slug+}'] but I don’t know how to get that type of dropdown to do an onchange, or how to pass that to a dynamic gallery.

However, if I were using a template to get the mla-gallery tag to render a dropdown as in your example, I can’t see the way to tell a gallery tag to work with Category names. For example, doing [mla_gallery taxonomy=attachment_category parent=82 ... ]doesn’t work, I assume that’s because the gallery tag inherently shows individual files instead of category names.

This is my best shot at it so far, using the dropdown-gallery template linked to in the Creating a Dropdown List of PDF files post:

<form id="mla-text-form" action="." method="post" class="row">

[mla_gallery attachment_category="grill-accessories" mla_markup=dropdown-gallery mla_onchange='onchange="return this.form.submit()"']

</form>

[mla_gallery]
ids="{+template:{+request:mla_dropdown+}"
post_parent=all
mla_caption="{+title+}"
[/mla_gallery]

• This reply was modified 7 years, 9 months ago by Greg_R. Reason: code tags
• This reply was modified 7 years, 9 months ago by Greg_R. Reason: more info

Thanks for your updates and for taking the time to work through the earlier topics I referenced. Thanks as well for posting the text of your shortcodes; very helpful.

I went back over the earlier examples and they aren’t as helpful as I first thought because the custom template and dynamic dropdown are for media library items, not taxonomy terms. I regret sending you down the wrong path; here’s a more specific suggestion for your application.

You can use custom style and markup templates with [mla_term_list] to get what you want. Here is an example:

1. Navigate to the Settings/Media Library Assistant Shortcodes tab
2. Click “Add New Template”
3. Select template type “Markup”
4. Select template shortcode “Term List”
5. Enter something like “dynamic-dropdown” in the Name section
6. Enter a Description if you like, e.g., “Dropdown control with onchange script.”
7. Fill the template sections with the values below
8. Scroll to the bottom of the page and click “Update” to save the template

Here are the section values:

Arguments

mla_output=dropdown
taxonomy=attachment_category
option_all_value=''
option_all_text='-- Select a value --'

Open

<form action="." method="get">
<[+itemtag+] name='current_item' class='term-list term-list-dropdown term-list-taxonomy-[+taxonomy+]' id='[+selector+]'  onchange='this.form.submit();'>

Item

	<[+termtag+] class='term-list-term term-list-dropdown-term level-[+level+]' value='[+slug+]' [+selected+]>[+thelabel+]</[+termtag+]>
	[+children+]

Close

</[+itemtag+]>
</form>

If you copy and paste the above code, make sure you don’t end up with “curly quotes” in your template; they won’t work. Note that the template wraps the control in a form so you don’t have to code that in your post/page.

Once that’s done you can change your shortcodes to something like:

[mla_term_list parent=82 mla_markup=dynamic-dropdown]

[mla_gallery attachment_category="{+template:{+request:current_item+}|grill-accessories+}"]

The [mla_term_list] shortcode will list the terms under the “grill-accessories” (term_id 82) parent and add the “Select a value” entry as the initial value. The “onchange” attribute will submit the form when one of the child terms is picked, adding the term slug to the URL in the current_item= query attribute. The [mla_gallery] copies the current_item to the attachment_category parameter to filter the display. The “grill-accessories” alternative in the template initializes the gallery to all items in the parent category when the page is first displayed. If you want an empty initial gallery instead, change it to something like “bad-term”.

I hope that gets you closer to a solution. Let me know if the above suggestions make sense and work for you. Thanks for your patience.

Thanks again, David. I’m back at work on this, but so far, using my new List Markup template always results in “mla_output is empty” being rendered on the page. The gallery markup seems to be fine. I’m in the process of testing to see where the breakdown is.

David, I could be wrong, but there seems to be an issue with the way that Attributes are being loaded by the shortcode templates. If I create a Markup template for Lists, it always fails when I put anything in Attributes. If I take all those Attributes, and place them in the shortcode, then it works as it’s supposed to.

I did get it to work mostly as desired, with the following shortcodes:

[mla_gallery attachment_category="{+template:{+request:current_item+}|grill-accessories+}" mla_output="paginate_links,prev_next" posts_per_page="36" columns=4]

[mla_term_list mla_output=dropdown taxonomy=attachment_category parent=82 option_all_value='grill-accessories' option_all_text='Grill Accessories' mla_markup=dynamic-dropdown]

[mla_gallery attachment_category="{+template:{+request:current_item+}|grill-accessories+}" posts_per_page="36" link=file mla_rollover_text="{+title+}" columns=4 size=full]

You’ll notice that all of the Attributes that were intended to go in the template, I put in the shortcode instead, otherwise, it resulted in a “mla_output is empty” message. It would be nice, though not essential, to have the option_all_value be static, and not tied to the slug as it is now. The way it works now, whatever you have as your text value will be slugified and override the option value, so if you have –Select an Option– then the value will be select-an-option, which gives an empty result.

Thanks for your update with the progress you’ve made.

The “mla_output is empty” issue was fixed in the latest MLA version, 2.53. You can move it to the template’s Arguments section once you update to the latest version.

The option_all_value can be anything you want. In your example above you have option_all_value='grill-accessories' and option_all_text='Grill Accessories'. If you change option_all_text to something else, the option_all_value should still be the same (grill-accessories). If that’s not working it is a defect and I will fix it. Can you give it another try and let me know?

David, I tried it just now, and can confirm that under MLA 2.53 the slugify behavior of option_all_text is still in effect and overrides option_all_value. Therefore changing option_all_text to All Grill Accessories results in a value of all-grill-accessories regardless of what is entered for option_all_value.

I confirm that the Arguments issue is fixed and the mla_output is empty issue has been resolved.

Thanks for your patience while I was on the road and for taking the time to confirm the defect in handling the option_all_value parameter.

I will work on more effective handling of the option_all_value parameter because combining it with a custom markup template is something I hadn’t thought through completely.

In the interim you can avoid the defect and get the results you want by adding mla_option_value='[+slug+]' to your Arguments section. That tells MLA your dropdown control uses slugs, not term_ids, and changes the handling of option_all_value in the way you want.

Let me know if that works for you. Thanks for bringing this defect to my attention.

I have uploaded a new MLA Development Version dated 20170604 that contains a fix for the option_all_value problem. It would be great if you installed the new version and let me know how it works for you. To get it, follow the instructions in this recent topic:

Fatal Error after upgrading to version 2.53

Let me know if you get a chance to test the fix. Thanks!

Ok, I downloaded your zip, and after a full backup, I’ll test. Thanks much!