access qml element from javascript

Question

Please, is it possible to access and change a property of a qml element from javascript function? I read that document.getElementById() should do the trick, but when I try that I get:

ReferenceError: document is not defined

Test.qml

import QtQuick 2.0
import QtQuick.Controls 1.2
import Test.js as JS 

Rectangle{
    id: rect
    color: "red"

    onClicked: {
        JS.changeMe();
    }
}

Test.js

function changeMe(){
   //change the color of element "rect"
   //document.getElementById("rect")
}

QML is not like HTML document. QML elements are referenced by ids. — RajaRaviVarma, Jul 18 '14 at 10:41

score 1 · Accepted Answer · answered Jul 14 '14 at 21:34

1

this worked:

Rectangle{
    id: rect
    color: "red"

    onClicked: {
        JS.changeMe(rect);
    }
}

function changeMe(rect){
   rect.color = "yellow";
}

answered Jul 14 '14 at 21:34

miro

809
10
25

access qml element from javascript

1 Answers1