Passing Selected Value in WordPress Category Dropdown - php

Question

I have a custom taxonomy and I've added a category dropdown to the archive page to allow users to quickly switch between categories. I have the following code, which works in redirecting users to the new category that they choose. However, the dropdown always defaults to the first option in the <select>. How can I pass the selected <option> through and set it as the default value when a user switches categories?
<?php
$args = array(
'taxonomy' => 'custom_taxonomy',
'orderby' => 'name',
'show_count' => 1,
'hierarchical' => 1,
'title_li' => 'title'
);
<form id="categoriesform" action="<?php bloginfo('url'); ?>" method="post">
<div>
<?php $cats = get_categories($args); ?>
<select id="categories" name="custom_taxonomy">
<option value="allCategories">All Categories</option>
<?php foreach ($cats as $cat) : ?>
<option value="<?php echo get_term_link($cat, $cat->taxonomy) ?>">
<?php echo $cat->name ?></option>
<?php endforeach; ?>
</select>
</div>
</form>
<script>
jQuery(document).ready(function() {
jQuery('#categories').change(function() {
if (jQuery(this).val() == 'allCategories') {
window.location = 'http://example.com/all-categories';
} else {
window.location = jQuery(this).val();
}
});
});
</script>

Answer 1

First you need to get current category id via get_queried_object()->term_id; then you check and add selected in option.
<?php
$current=get_queried_object()->term_id;
$args = array(
'taxonomy' => 'custom_taxonomy',
'orderby' => 'name',
'show_count' => 1,
'hierarchical' => 1,
'title_li' => 'title'
);
<form id="categoriesform" action="<?php bloginfo('url'); ?>" method="post">
<div>
<?php $cats = get_categories($args); ?>
<select id="categories" name="custom_taxonomy">
<option value="allCategories">All Categories</option>
<?php foreach ($cats as $cat) : ?>
<option <?php echo ($current == $cat->term_id ? 'selected' : ''); ?> value="<?php echo get_term_link($cat, $cat->taxonomy) ?>">
<?php echo $cat->name ?></option>
<?php endforeach; ?>
</select>
</div>
</form>
<script>
jQuery(document).ready(function() {
jQuery('#categories').change(function() {
if (jQuery(this).val() == 'allCategories') {
window.location = 'http://example.com/all-categories';
} else {
window.location = jQuery(this).val();
}
});
});
</script>