[SOLVED]Access dynamically created object (created with Qt.createQmlObject in Javascript) from another dynamically created object

Tory Gaurnier

OK, so, it seems I'm having one issue after another, and here is my latest. I have a dynamically created ListModel created in Javascript with Qt.createQmlObject(), then I have a dynamically created GridView also created in Javascript with Qt.createQmlObject(), which needs to set it's model to the dynamically created model. Now I can not figure out how to do this for the life of me, because dynamically created objects have no QML id. The model is added to my root element, I've tried 'model: root.myModelID' just to see if it would work, and of course it didn't.

Now from what I understand a dynamically created object can only be accessed from the object returned by Qt.createQmlObject(), so I even tried making making a globalvars.js file, declaring 'var model;' in the file, including it in my QML file, then returning my dynamically created model as such:
globalvars.js:
@
var myModel;
@

QML file:
@
import "globalvars.js" as Vars
// Then later I have this
Component.onCompleted: {
Vars.myModel = createMyModel(); /* The ListModel created by Qt.createQmlObject() is returned /
createMyGridView(); / This is where I use Qt.createQmlObject() to create a GridView, which is then trying to use Vars.myModel as the model */
}
@

Now when I try that, it throws the error: 'ReferenceError: Vars is not defined'

This is getting very frustrating, I need to figure out a way to set the model, I tried to search to see if GridView has a method to set the model, because that would solve my problem as I wouldn't have to have it set the model in the dynamic creation (in Qt.createQmlObject()), I could just pass myModel to createMyGridView(), then call the Javascript method of myGridView, but GridView has no method to set the model.

I hope my question makes sense, if it doesn't please let me know and I'll try to clarify further. Any help is greatly apprecieated.

JapieKrekel

I'm not sure if I understand what you are building...

You should be able to simply assign to the model of your created gridview
@var myGrid=createMyGridView();
var myModel = createMyModel();
myGrid.model = myModel;@

Sounds complicated to use a dynamically created ListModel. I would use a JavaScript array in that case.
And a dynamic GridView, I would use a separate QML file for the GridView and stuff and use createComponent and createObject. But I will not doubt your reasons for making it dynamically.

I cooked up a simple example with a dynamic GridView (do not see why you need to make it dynamically, but anyhow).

@import QtQuick 1.1

Rectangle {
id: main
width: 360
height: 360

property variant myModel: [{name: "Apple", cost: 2.45},
                           {name: "Orange", cost: 3.95},
                           {name: "Banana", cost: 1.95},
                           {name: "Ananas", cost: 4.25}]


function createMyGridView(theParent) {
    return Qt.createQmlObject('import QtQuick 1.1; GridView {' +
    'anchors.fill: parent;' +
    'delegate: Component {' +
        'Rectangle {' +
            'width: 30;' +
            'height: 20;' +
            'Text {'+
                'anchors.fill: parent;' +
                'text: modelData.name + "= $" + modelData.cost;' +
            '}' +
          '}' +
          '}' +
          '}',
       theParent, "");
}

Component.onCompleted: {
    var jsModel = [{name: "Apple", cost: 2.45},
                   {name: "Orange", cost: 3.95},
                   {name: "Banana", cost: 1.95},
                   {name: "Ananas", cost: 4.25}];

    var gridview = createMyGridView(main);
    gridview.model = jsModel; // main.myModel;
}

}@

In this example I show two ways of making the data model. One is as a variant property in which you can basically put any JavaScript Object or Array. Since data models want to have a list, I put an Array in it.
If you only need to use it in Javascript you can use the var jsModel example.
Using either of them is simply assigning it to the model of the gridview.

Accessing the data from your model in the delegate of your Gridview is done by using the property modelData.

I hope it helps. Happy coding...

Tory Gaurnier

Thank you, you're amazing :D

myGrid.model = myModel; was all I needed, and I don't know why I didn't think of trying that, it just makes sense when I saw it in your post.

And I actually was making my ListModels and GridViews as arrays, I just posted a very very simplified version of what I'm doing, and I thought of having separate QML files for my dynamic objects, but the way I'm making it this made the most sense, I need to be able to add variables, like so:
@
//Pretend this is inside a Qt.createQmlObject()
'//MyDynamicQmlStuff' + i + '//MyDynamicQMLStuffContinued'
@

The way I'm creating my app having these components dynamically created is crucial (at least in my head :P ), it's not too difficult though, I just get stuck on these simple little things.