BlackBerry 10 Cascades: How do I load data into a DropDown?

Question

I have managed to load data from a remote Json web service into a QML ListView, but there doesn't seem to be any such thing for the DropDown control.

Does someone have an example or an alternative method to accomplish a DropDown bound to attachedObjects data sources in Cascades?

Answer 1

I have an alternate method for you, Do note that I have used google's web service here for demonstration purpose, you need to replace it with your url & parse response according to that.

import bb.cascades 1.0

Page {
    attachedObjects: [
        ComponentDefinition {
            id: optionControlDefinition
            Option {
            }
        }
    ]
    function getData() {
        var request = new XMLHttpRequest()
        request.onreadystatechange = function() {
            if (request.readyState == 4) {
                var response = request.responseText
                response = JSON.parse(response)
                var addressComponents = response.results[0].address_components
                for (var i = 0; i < addressComponents.length; i ++) {
                    var option = optionControlDefinition.createObject();
                    option.text = addressComponents[i].long_name
                    dropDown.add(option)
                }
            }
        }

        // I have used goole's web service url, you can replace with your url
        request.open("GET", "http://maps.googleapis.com/maps/api/geocode/json?address=" + "Ahmedabad" + "&sensor=false", true)
        request.send()
    }
    Container {
        DropDown {
            id: dropDown
        }
        Button {
            onClicked: getData()
        }
    }
}

Hope this helps.