Disable dropdowns on conditional filters

  • First of all, great plugin!

    I’m currently building a site that uses Make / Model / Year filters to filter cars. Using the conditional filter aspect it works well and I was able to add a custom bit of css;

    .select2-container–default .select2-results__option[aria-disabled=true] {
    display:none !important;
    }

    So that the non-aplicable options fully disappear as the user selects make > model > year

    One other tweak that would be cool though is if it was possible to force the user to select ‘Make’ before ‘Model’ and ‘Year’ to effectively make those boxes empty (or at least appear empty), or disable the dropdown somehow until a make has first been chosen (then same for model, i.e.e only display ‘Year’ when a model has been chosen.

    Is there a simple way to do this do you think?

    I have a test page here: https://lowmoorcarbreakers.co.uk/site/breaking/

    Thanks in advance.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Jonathandejong

    (@jonathandejong)

    Hi @doynie

    Thank you ?? Leave a review if you like, it spurs me to keep adding features ??

    I already have plans to make something like that. Basically allow you to set dropdowns conditional to each other (not just the terms/options in them). I however have seriously little free time to work on my open source projects atm. :/

    To achieve a similar thing you could just create some custom JS and CSS.
    Add visibility:hidden; (or display:none; ) to your “conditional dropdowns”.
    Then check whenever each are changed with js and show/hide if there is/is-not a value selected.

    Supersimple sample code to get you started:

    
$('.select-make').change(function(){
	// make changed.
	var val = $(this).val();

	if( val.length > 0 ) {
		$('.select-model').show();
	} else {
		$('.select-model, .select-year').hide();
	}
});
    Thread Starter doynie

    (@doynie)

    Sweet thanks man, yea I was thinking some JS would be good, I’ll have a crack at something. Thanks for the sample code to get me going ??

    Review to follow!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Disable dropdowns on conditional filters’ is closed to new replies.