Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Access to an array from dynamically created element



  • Hi,
    I create dynamically some MyElements.qml on the main page and I save them into an array (I do this from main.qml).
    Then I dynamically create MyCategoryElements.qml and when I click on them, I want to update existing MyElements.qml (I do this from MyCategoryElements.qml).
    Problem is that when I try to update elements from my array, the array does not exist because I can not get it from dynamically created element.



  • Could you add your exemple please ?



  • Ok.

    main.qml
    @
    import QtQuick 1.0
    import "api.js" as Api

    Rectangle {
    Rectangle {
    id: content
    }
    Rectangle {
    id: categoryItems
    }
    Component.onCompleted: {
    Api.getResponse("category-apps", categoryItems, "CategoryItem.qml");
    Api.getResponse("app-list-homepage&count=10", content, "CategoryApps.qml");
    }
    }@

    api.js
    @
    function getResponse(type, parentx, elem) {
    var xml = new XMLHttpRequest;
    xml.onreadystatechange = function() {
    if (xml.readyState == XMLHttpRequest.DONE) {
    var b = xml.responseXML.documentElement;

           if (type.split("&")[0] == "app-list-homepage") {
    
           if (components.length < b.childNodes.length) { // if I need to display more items than I created
               for (var xx = 0; xx < components.length; xx++) {
                   var a = b.childNodes[xx];
                   update(a.childNodes[10].firstChild.nodeValue, a.childNodes[2].firstChild.nodeValue,                 a.childNodes[6].firstChild.nodeValue, a.childNodes[16].firstChild.nodeValue, xx, a.childNodes[0].firstChild.nodeValue);
               }
               for (var xx = components.length; xx < b.childNodes.length - components.length + xx; xx++) {
                   var a = b.childNodes[xx];
                   createElementObjects(elem, parentx, a.childNodes[10].firstChild.nodeValue, a.childNodes[2].firstChild.nodeValue, a.childNodes[6].firstChild.nodeValue, a.childNodes[16].firstChild.nodeValue, xx, a.childNodes[0].firstChild.nodeValue);
               }
           }
           else if (components.length == b.childNodes.length) { // if I need to display same items as I created
               for (var xx = 0; xx < components.length; xx++) {
                   var a = b.childNodes[xx];
                   update(a.childNodes[10].firstChild.nodeValue, a.childNodes[2].firstChild.nodeValue, a.childNodes[6].firstChild.nodeValue, a.childNodes[16].firstChild.nodeValue, xx, a.childNodes[0].firstChild.nodeValue);
               }
           }
           else if (components.length > b.childNodes.length) { // if I need to display fewer items than I created
               for (var xx = 0; xx < b.childNodes.length; xx++) {
                   var a = b.childNodes[xx];
                   update(a.childNodes[10].firstChild.nodeValue, a.childNodes[2].firstChild.nodeValue, a.childNodes[6].firstChild.nodeValue, a.childNodes[16].firstChild.nodeValue, xx, a.childNodes[0].firstChild.nodeValue);
               }
               for (var xx = b.childNodes.length; xx <= components.length; xx++) {
                   components[components.length - 1].destroy();
                   components.pop();
               }
           }
    
           }
    
           else if (type.split("&")[0] == "category-apps") {
               categoryList.contentHeight = b.childNodes.length * 80 + 80;
               for (var xx = 0; xx < b.childNodes.length; xx++) {
                   var a = b.childNodes[xx];
                   createElementObjects(elem, parentx, a.childNodes[3].firstChild.nodeValue, a.childNodes[1].firstChild.nodeValue, null, null, xx, a.childNodes[0].firstChild.nodeValue);
               }
           }
    
       }
    }
    
    var fullURL = "adress.aspx?type=" + type + "&OsPlatform=Symbian&";
    
    fullURL += "nocache=" + (new Date().getTime());
    xml.open("GET", fullURL);
    xml.send();
    

    }

    var component;
    var element;
    var components = [];

    function createElementObjects(elem, parentx, icon, name, category, rate, ii, id) {
    component = Qt.createComponent(elem);
    if (component.status == Component.Ready)
    finishCreation(parentx, icon, name, category, rate, ii, id);
    else {
    component.statusChanged.connect(finishCreation(parentx, icon, name, category, rate, ii, id));
    }
    }

    function finishCreation(parentx, icon, name, category, rate, ii, id) {
    element = component.createObject(parentx);

    element.icon = icon;
    if (parentx == content) {
        components[ii] = element;
        element.name = name;
        element.category = category;
        element.rate = "images/" + rate + "stars.png";
        element.y = ii * 81 + 120;
        element.id = id;
    }
    else {
        element.icon = icon;
        element.text = name;
        element.id = id;
        element.y = ii * 80 + 80;
    }
    

    }

    function update(icon, name, category, rate, ii, id) {
    components[ii].icon = icon;
    components[ii].name = name;
    components[ii].category = category;
    components[ii].rate = "images/" + rate + "stars.png";
    components[ii].y = ii * 81 + 120;
    components[ii].id = id;
    }
    @

    CategoryItems.qml
    @
    import QtQuick 1.0
    import "api.js" as Api

    ...
    MouseArea {
    width: 360
    height: 80
    onClicked: {
    Api.getResponse("app-list-recommanded&count=100&CategoryID=" + categoryId.text, content, "CategoryApps.qml");
    }
    }
    ...
    @

    So after main.qml load I create categories and then items in the content rectangle. There are 10 items in the content rectangle (and components array too).
    When I click on one of category rectangles I have an empty components array because main.qml variables are not in dynamically created CategoryItems.qml.


Log in to reply