How can I pass a variable as an option when creating a jQuery UI accordion?

Question

I have this code:

$(acc_id).accordion({
    alwaysOpen: false,
    active: false,
    autoheight: false,
    header: 'h3.ui-accordion3-header',
    clearStyle: true
});

I want to send a variable to it, since the header should be unique.

Answer 1

Try:

function Accord(acc_id, header_id) {
    $('#' + acc_id).accordion({
        alwaysOpen: false,
        active: false,
        autoheight: false,
        header: header_id,
        clearStyle: true
    });
}

Answer 2

var header = 'h3.ui-accordion3-header';
$(acc_id).accordion({
        alwaysOpen: false,
        active: false,
        autoheight: false,
        header: header,
        clearStyle: true
    });

Answer 3

Not totally sure what you're looking for, but something like this may work

$(acc_id).accordion({
    alwaysOpen: false,
    active: false,
    autoheight: false,
    header: $(this).find('h3.ui-accordion3-header').text(),
    clearStyle: true
});

Answer 4

The approach given in the examples by ChaosPandion and rochal (where the header is defined from a variable) seems best to me, but another useful thing to know about is that you can redefine any option on an accordion by using the "option" option, like this:

$(acc_id).accordion({
                                alwaysOpen: false,
                                active: false,
                                autoheight: false,
                                header: 'placeholder',
                                clearStyle: true
                        });
$(acc_id).accordion('option', 'header', 'h3.ui-accordion3-header');

In this way you can create the accordion and then, afterwards, set the header value.