Hiding view filter option based on another filter selection I have a view with search criteria and the search criteria looks like below:

Age group(options: new born, toddler, pre-school)
Classroom (options: NA, potty-trained, transition, not-trained) All these filter fields are check boxes.

When I select 'new born' as age-group, all of the classroom options should be hidden/disabled except NA option When I select 'toddler/pre-school' all of the classroom options should show up again except NA option

I am using the below code for doing this:

$('#edit-field-agegroup-value-1').click(function() {
    if( $(this).is(':checked')) {
        $("#edit-field-classroom-value-3").prop('disabled', true);
     } else {
        $("#edit-field-classroom-value-3").prop('disabled', false); 
     }
    });


This code is working fine. However, when I submit the refresh button the page refreshes and the disabled fields show enabled again. Any help on how this can be fixed?
Run the check on page page load, not just on click:

 ... wrapped in the usual Drupal boilerplate

disableFilter($('#edit-field-agegroup-value-1'));

$('#edit-field-agegroup-value-1').click(function() {
    disableFilter($(this));
});

function disableFilter(element) {
    if( element.is(':checked')) {
        $("#edit-field-classroom-value-3").prop('disabled', true);
     } else {
        $("#edit-field-classroom-value-3").prop('disabled', false); 
     }    
}