Question

I using dropkick js to style dropdown forms but have one little problem. What I want to do is to make two thing when the selection is made: generate another dropdown based on the selection and print the value in console (just for a simplicity). Also I want to print the value of the generated dropdown in console as well. So here is what my code looks like:

$('.dropStyled').dropkick({
        change: function (value, label) {
            $('#subCategory').find('span.sub').html('<select id="selectSubCountry" name="subCountry" class="dropStyledSub" tabindex="2"></select>');                
            $('#selectSubCountry').append($("<option></option>").attr("value",'test').text(label));
            $('.dropStyledSub').dropkick(function() { //this is the dropdown I create dynamically
                change: function(val, lab) {
                    console.log(val);
                }
            });

            console.log(value);
        }
    });

The problem is that I get “Uncaught SyntaxError: Unexpected token ,” on this line:

change: function(val, lab) {

Any ideas?

Answer 1

Remove the function() in the parameter of the 2nd dropkick, it has to be an object:

$('.dropStyled').dropkick({
    change: function (value, label) {
        ...
        $('.dropStyledSub').dropkick({ //this is the dropdown I create dynamically
            change: function(val, lab) {
                console.log(val);
            }
        });
        ...
    }
});