CODEWITHSUNDEEP
jqueryaccordionsemantic-ui
user3386514
user3386514

Reputation: 41

Determine currently opened Semantic UI accordion index

Trying to figure out how to determine currently open part of Semantic UI accordion (http://semantic-ui.com/modules/accordion.html):

This works for jQuery UI Accordion, does not work for Semantic UI:

$("#accordion").accordion('option','active');

Also tried below code, but always returns "1":

    $('#selector').accordion({
        onChange: function() {  
            alert("selected" + $('#selector').index() );
        }
    });

Upvotes: 1

Views: 2666

Answers (2)

Javier Rivera
Javier Rivera

Reputation: 1

This is my function and works!!

window.AcordionIndex = async (div) => {
    var index = 0;
    for (var i = 0; i < document.getElementById(div.replace("#", "")).children.length; i++) {
        var clase = document.getElementById(div.replace("#", "")).children[i].className;
        if (clase.indexOf('title') != -1) {
            if (clase.indexOf('title active') != -1) {
                break;
            }
            index++;
        }
    }
    return index;
}

Upvotes: 0

Dimitar Ivanov
Dimitar Ivanov

Reputation: 181

Inside the onChange callback, this returns selected content' container as a jQuery object. So you can use it with the index() method, filtered by content selector. Try with next, it works for me:

$('.ui.accordion').accordion({
    onChange: function () {
        alert(this.index(".content"));
        console.log(this.index(".content"));
    }
});

Working example: http://jsfiddle.net/n8o1ps0t/

Upvotes: 5

Related Questions