Access variable is be undefined

Solayer

i have 2 function in a js file, first function can use a varriable but when secondary function use varriable then result is undefined.

it's work with correct name file.

function createNewFile(){
    if(nameRoom !== ""){
        file.writeFile(nameRoom, nameRoom + "," + fileURL);
        displayFormInput = false;
    }
    else{
        console.log("Vui Lòng Nhập Tên Phòng");
    }
}

it's not work with same varriable and error mesg "ReferenceError: nameRoom is not defined"

function endDrag(){
    file.writeFile(nameRoom + "123", newThietBi.x + "," + newThietBi.y + ",");
}

Room.qml

import QtQuick 2.0
import QtQuick.Controls 2.5
import "main.js" as Js
Image {
    id: imageBackground
    anchors.fill: parent
    property string nameRoom: inputRoomName.text
    property bool displayFormInput: true
    z:-1
    Rectangle{
        id: formInputRoomName
        visible: displayFormInput
        width: 200
        height: 50
        color: "transparent"
        border.color: "black"
        border.width: 1
        radius: 10
        anchors.centerIn: parent
        TextField{
            width: 100
            id: inputRoomName
            text: ""
            placeholderText: "Nhập tên phòng"
            font.pixelSize: 14
            anchors.verticalCenter: parent.verticalCenter
            anchors.left: parent.left
            anchors.leftMargin: 5
            background: Rectangle{
                border.color: "transparent"
                color: "transparent"
            }
        }
        Rectangle{
            width: 50
            height: 40
            color: "black"
            radius: 10
            anchors.verticalCenter: parent.verticalCenter
            anchors.right: parent.right
            anchors.rightMargin: 5
            Text{
                color: "white"
                text: "OK"
                anchors.centerIn: parent
            }
            MouseArea{
                anchors.fill: parent
                onClicked: {
                    Js.createNewFile();
                }
            }
        }
    }
}

MenuAdminTTB.qml

import QtQuick 2.14
import QtQuick.Window 2.14
import QtQuick.Controls 2.5
import FileIO 1.0
import "main.js" as Js
Rectangle{
    id: menuAdminTTB
    height: parent.height/8
    anchors{ top: parent.top; left: parent.left; right: parent.right }
    color: "black"
    visible: false
    z: 10
    FileIO{
        id: file
    }
    Row{
        id:row
        spacing: 10
        topPadding: 10
        bottomPadding: 10
        Rectangle{
            width: menuAdminTTB.width/8
            height: menuAdminTTB.height/1.3
            x: 50
            color: "white"
//            anchors.verticalCenter: parent.verticalCenter
            radius: 20
            Text{
                text: "Thêm thiết bị"
                font.pointSize: 16
                color: "black"
                anchors.centerIn: parent
            }
            MouseArea{
                anchors.fill: parent
                onPressed: {
                    Js.startDrag(mouse)
                }
                onPositionChanged: {
                    Js.continueDrag(mouse)
                }
                onReleased: {
                    Js.endDrag()
                }
            }
        }

        Rectangle{
            width: menuAdminTTB.width/8
            height: menuAdminTTB.height/1.3
//            anchors.right: parent.right
//            anchors.rightMargin: 50
            color: "white"
//            anchors.verticalCenter: parent.verticalCenter
            radius: 20
            Text{
                text: "Xóa toàn bộ"
                font.pointSize: 16
                color: "black"
                anchors.centerIn: parent
            }
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    file.clearData("testNew")
                }
            }
            Component.onCompleted: {
                Js.createItemComponentWhenStartup();
            }

        }
    }
}

i try to with global varriable but not work
sorry my english's bad

Johan_R28

Hi @Solayer
The reason of this behaviour is explained here: https://doc.qt.io/qt-5/qtqml-documents-scope.html

The scope of a variable defined in root object of file is restricted to all items declared in it.

createNewFile() is called from Room.qml where nameroom is defined.

endDrag() is called from MenuAdminTTB.qml where you don't have any definition of nameroom

If you want to access this property in this two objects, you have many options:

declare it at least at the first common parent of this two objects
Room {id: room} and MenuAdminTTB {id: menuAdminTTB}
access this variable by aliasing the item where this variable is defined, at the first common parent and get this variable with room.nameroom
https://doc.qt.io/qt-5/qtqml-syntax-objectattributes.html#property-aliases
or to define this property in your js file (don't forget .pragma library at the begining of the file)
https://doc.qt.io/qt-5/qtqml-javascript-resources.html#shared-javascript-resources-libraries
and so on ..

Qt World Summit: Register Today!

Access variable is be undefined