Javascripts for archive pulldowns in sidebar working erratically

  • I have three pulldown menus in the site’s sidebar to create views by category for a product line: by model type, by year produced, or by status. Each of these uses the following code, customized for each of the pulldowns:

          <div class="sidebarItem">
         <h4>Model Type</h4>
         <?php wp_dropdown_categories('show_option_none=Select model type&include=18,19,20,21');??>

         <script type="text/javascript"><!--
            var dropdownModel = document.getElementById("cat");
            function onCatChangeModel() {
               if ( dropdownModel.options[dropdownModel.selectedIndex].value > 0 ) {
                  location.href = "<?php echo get_option('home');
         ?>/?cat="+dropdownModel.options[dropdownModel.selectedIndex].value;
               }
            }
            dropdownModel.onchange = onCatChangeModel;
         --></script>
      </div>

    Each has unique names for variables and functions, and each works…but only if it is placed first in the sidebar. The other two, whichever ones they are, will not work.

    I’m not a javascript expert by any means, but it seems obvious that the first script in line is interfering somehow with the other two. Does anyone have some idea of what can be done to stop this from happening? This is a standard script I’ve used for years, but have never tried to use it more than once at a time.

Viewing 2 replies - 1 through 2 (of 2 total)

  • Would it be possible to show us all the 3 scripts or a link to your site?

    Thread Starter Who_Dat

    (@who_dat)

    Aaargh! I accidentally marked the notification email as spam, so I’m just seeing this reply. I can’t let you see the site, because it’s behind a “Coming Soon” plugin that requires you log in. But the full code for all three scripts is this:

    <div class="sidebarItem">
         <h4>Model Type</h4>
         <?php wp_dropdown_categories('show_option_none=Select model type&include=18,19,20,21');??>

         <script type="text/javascript"><!--
            var dropdownModel = document.getElementById("cat");
            function onCatChangeModel() {
               if ( dropdownModel.options[dropdownModel.selectedIndex].value > 0 ) {
                  location.href = "<?php echo get_option('home');
         ?>/?cat="+dropdownModel.options[dropdownModel.selectedIndex].value;
               }
            }
            dropdownModel.onchange = onCatChangeModel;
         --></script>
      </div>
   
      <div class="sidebarItem">
         <h4>Year Produced</h4>
         <?php wp_dropdown_categories('show_option_none=Select year produced&include=7,8,9,10,11,12,13,14,15,16,17');??>

         <script type="text/javascript"><!--
            var dropdownYear = document.getElementById("cat");
            function onCatChangeYear() {
               if ( dropdownYear.options[dropdownYear.selectedIndex].value > 0 ) {
                  location.href = "<?php echo get_option('home');
         ?>/?cat="+dropdownYear.options[dropdownYear.selectedIndex].value;
               }
            }
            dropdownYear.onchange = onCatChangeYear;
         --></script>
      </div>
   
      <div class="sidebarItem">
         <h4>Identified/Unidentified</h4>
         <?php wp_dropdown_categories('show_option_none=Select status&include=22,23');??>

         <script type="text/javascript"><!--
            var dropdownStatus = document.getElementById("cat");
            function onCatChangeStatus() {
               if ( dropdownStatus.options[dropdownStatus.selectedIndex].value > 0 ) {
                  location.href = "<?php echo get_option('home');
         ?>/?cat="+dropdownStatus.options[dropdownStatus.selectedIndex].value;
               }
            }
            dropdownStatus.onchange = onCatChangeStatus;
         --></script>
      </div>
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Javascripts for archive pulldowns in sidebar working erratically’ is closed to new replies.