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

From JReviews Documentation
Jump to: navigation, search

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.

// 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) {       
   // Only show field2 when Cat ID 2 is selected
   else if(selected == 2) {       
   // Only show field3 when Cat ID 3 is selected
   else if(selected == 3) {