How to toggle custom fields based on the category selection in the Advanced Search Module

Add the following code at the bottom of your adv. search module theme file and modify according to your specific category IDs and field names.

<script>
// Bind the change event for the category select list
 
jQuery('select[name="data[categories]"]').on('change',function() {            
 
   var form = jQuery(this).closest('form');
 
   // Get the selected cat id
   var selected = jQuery(this).val();        
 
   // Get all the input objects that will be toggled based on the category selected
 
   var field1 = form.find('.jr_field1').val('').closest('.jrFieldDiv'),
       field2 = form.find('.jr_field2').val('').closest('.jrFieldDiv'),
       field3 = form.find('.jr_field3').val('').closest('.jrFieldDiv');
 
   // Only show field1 when Cat ID 1 is selected
 
   if(selected == 1) {       
      field1.hide();
      field2.show();
      field3.hide();
   }
 
   // Only show field2 when Cat ID 2 is selected
 
   else if(selected == 2) {       
      field1.hide();
      field2.show();
      field3.hide();
   }
 
   // Only show field3 when Cat ID 3 is selected
 
   else if(selected == 3) {       
      field1.hide();
      field2.hide();
      field3.show();
   }
});
</script>