How to call qml function from html side

bartalke

Hi,
I want to invoke form HTML a someFoo("someStr") function wich is located in QML as follows:

QML

import QtQuick 2.5
import QtQuick.Window 2.2
import QtWebEngine 1.0
import QtWebChannel 1.0

Window {
visible: true
width: 640
height: 480

QtObject {
    id: myQmlObj

    WebChannel.id: "myQmlObj";

    function someFoo(msg) {
        console.log(msg);
    }
}

WebEngineView {
    id: view
    anchors.fill: parent
    url: "myHtml.html"

    WebChannel {
       id: webChannel
       registeredObjects: [myQmlObj]
    }
}
}

HTML

<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
<script type="text/javascript">
    new QWebChannel(qt.webChannelTransport, function (channel) {
        var myQmlObj = channel.objects.myQmlObj;
        myQmlObj.someFoo("blabla");
    });
</script>

.pro file includes

QT += core gui network webenginewidgets webchannel

but when I try it I get the following error:

js: Uncaught ReferenceError: qt is not defined

Does anybody have an idea what I am doing wrong ? I am using Qt 5.9

DBoosalis

Hard to say, as you don't provide all the code. I have used webchannel with Qt 5.9 so know it works. Your code looks right
Do you have a "import QtWebChannel" in your QML. How about moving the WebChangel declaration out of your WebEngineView
and/or declaring it like this:

WebChannel {
id:wc
registeredObjects: [mapController]
}

WebEngineView {
...
webChannel: wc
}

DBoosalis

@bartalke
One more thing , since our problem seems to be on the html side. Try removing the qrc: from the javascript.
src="qwebchannel.js"