title: Replacing hierarchal checkboxes with dropdown selector on custom taxonomy inside custom post type
body: <p>I have seen several blog posts on this topic but have not been able to implement them with success.</p>
  
  <p>I have tried the following (perhaps one of these is the solution and I am slightly off):</p>
  
  <ol>
  <li><a href="https://pagecrafter.com/dropdown-menu-of-all-terms-in-custom-taxonomy-wordpress/" rel="nofollow noreferrer">https://pagecrafter.com/dropdown-menu-of-all-terms-in-custom-taxonomy-wordpress/</a></li>
  <li><a href="https://stackoverflow.com/questions/52823925/wordpress-taxonomy-dropdown-is-not-working-with-hierarchical">Wordpress - taxonomy dropdown is not working with hierarchical</a></li>
  <li><a href="https://www.noelsheppard.co.uk/create-dropdown-list-custom-taxonomy-terms/" rel="nofollow noreferrer">https://www.noelsheppard.co.uk/create-dropdown-list-custom-taxonomy-terms/</a> (basically example 1)</li>
  <li><a href="https://shibashake.com/wordpress-theme/wordpress-custom-taxonomy-input-panels" rel="nofollow noreferrer">https://shibashake.com/wordpress-theme/wordpress-custom-taxonomy-input-panels</a></li>
  <li>lastly, read over <a href="https://codex.wordpress.org/Function_Reference/wp_dropdown_categories" rel="nofollow noreferrer">this</a></li>
  </ol>
  
  <p>I have a CPT of Properties, that has three custom taxonomies:</p>
  
  <ol>
  <li>Guests</li>
  <li>Rooms</li>
  <li>City (The city taxonomy is populated through a custom function that watches for when a second CPT [Destinations] has new posts created and adds the same name as a taxonomy to the Properties City entries)</li>
  </ol>
  
  <p>I would like to ensure that when creating a Property post and setting its city that only one city(destination) is selected. I would like to use a dropdown for this action.</p>
  
  <p>Following the 1st(or 3rd) link above's example I have tried the below implementation:</p>
  
  <p>The function for initializing in my functions.php:</p>
  
  <pre><code>// Creates dropdown taxonomy select for guest taxonomy in Properties.
  function dropdown_tax_init(){
  
    $categories = get_categories('taxonomy=city');
    $select     = "&lt;select name='cat' id='cat' class='top-tags-dropdown'&gt;n";
    $select .= "&lt;option value='-1'&gt;Select Tag&lt;/option&gt;n";
    foreach ($categories as $category) {
        if ($category-&gt;count &gt; 0) {
            $select .= "&lt;option value='" . $category-&gt;slug . "'&gt;" . $category-&gt;name . "&lt;/option&gt;";
        }
    }
    $select .= "&lt;/select&gt;";
    echo $select;
  
  }
  
  add_action( 'init', 'dropdown_tax_init' );
  </code></pre>
  
  <p>I also call the js via my functions.php like so:</p>
  
  <pre><code>function admin_footer_script() {
      wp_register_script('dropdown_tax_script', get_template_directory_uri() . '/js/taxonomy-dropdown.js', array('jquery'), '1.0.0'); // Conditional script(s)
      wp_enqueue_script('dropdown_tax_script'); // Enqueue it!
  }
  
  add_action( 'admin_footer', 'admin_footer_script' );
  </code></pre>
  
  <p>Lasty, my js is as follows:</p>
  
  <pre><code>var dropdown = document.getElementById("cat");
  
  function onCatChange() {
      if (dropdown.options[dropdown.selectedIndex].value != -1) {
          location.href = "&lt;?php echo home_url();?&gt;/city/" + dropdown.options[dropdown.selectedIndex].value + "/";
      }
  }
  dropdown.onchange = onCatChange;
  
  </code></pre>
  
  <p>My javascript is showing in inspect in the admin footer.</p>
  
  <p>The drop down flashes on load but the custom taxonomies do not load when I have the function in my function.php something is breaking the loading of custom taxonomies in the right sidebar in the Gutenberg editor. They never show up.</p>
  
  <p>Happy to go into further details, thank you.</p>