Question

I have a form where I have multiple fields, but it’s essential that two of the dropdowns at least are chosen, and until they are, i disable and relabel the submit button

I am using the following for one of the fields, is there a way to double up, id of other field is #list_name

So, #category and #list_name must be chosen with a value before submit is enabled

$(document).ready(
function(){
    $('#category').change(
        function(){
            if ($(this).val()) {
                $('input:submit').attr('disabled',false);
                $('#btn_show').addClass('button green');
                $("#btn_show").attr('value', 'Add To My List');

            } else { 
                $('#btn_show').removeClass('button green'); 
                $('input:submit').attr('disabled',true); 
                $("#btn_show").attr('value', 'Choose a category and list for your item');
            }
        });

});

I’ve tried using normal jquery multiple:

$('#category', '#list_name').change(

But it didn’t work

Answer 1

It would be

$('#category, #list_name').change()

This one looks for the category element inside of the context of list_name

$('#category', '#list_name').change() 

the entire code would look something like this

$('#category, #list_name').change(
        function(){
            if ($('#category').val() && $('#list_name').val()  ) {
                $('input:submit').attr('disabled',false);
                $('#btn_show').addClass('button green');
                $("#btn_show").attr('value', 'Add To My List');

            } else { 
                $('#btn_show').removeClass('button green'); 
                $('input:submit').attr('disabled',true); 
                $("#btn_show").attr('value', 'Choose a category and list for your item');
            }
        });