Cascades QML Create Tabs Dynamically From JSON

Using XMLHttpRequest in QML and ComponentDefinition to create tabs from a JSON feed.

import bb.cascades 1.2

TabbedPane {
    showTabsOnActionBar: false
    attachedObjects: [
        ComponentDefinition { //allows us to create tabs dynamically
            id: tabControlDefinition
            Tab {
                property string textString
                title: textString
                Page {
                    Container {
                        Label {
                            text: textString
                        }
                    }
                }
            }
        }
    ]
    onCreationCompleted: {
        //get the networks and add them to the drop down menu
        var request = new XMLHttpRequest()
        request.onreadystatechange = function() {
            if (request.readyState == 4) { //4 means the request is complete
                var response = request.responseText
                response = JSON.parse(response)
                var tabComponents = response.networks
                for (var i = 0; i < tabComponents.length; i ++) {
                    var createdTab = tabControlDefinition.createObject();
                    createdTab.textString = tabComponents[i]
                    console.log(tabComponents[i])
                    add(createdTab);
                }
            }
        }
        request.open("GET", "http://example.json.php", true)
        request.send()
    }
}
This entry was posted in Uncategorized. Bookmark the permalink.
  • arghell

    can you please elaborate on this? i can’t seem to get it working… thx