Custom Component

sush123

This post is deleted!

sush123

This post is deleted!

ODБOï

I did a quick test, and i don't have val1 is not defined error.
Its hard give you an answer because we don't know how InputRow is defined.
I did a very simple InputRow Component to test your code

//InputRow.qml

import QtQuick 2.12
import QtQuick.Layouts 1.12
RowLayout{
    property var component
}

//your code



Window {
    visible: true
    width: 300
    height: 300

    InputRow{

        component:  Column{
            spacing: 10
            Row{

                spacing: 50

                Text{
                    text: "Val1"
                    font.pointSize: 10
                }
                TextInput {
                    id:val1
                    width: 5
                    text: "777"
                    font.pointSize: 10
                }

                Text{
                    text: "m"
                    font.pointSize: 10
                }
            }
            Row{
                spacing: 50

                Text{
                    text: "Val2"
                    font.pointSize: 10
                }

                TextInput {
                    id:val2
                    width: 5
                    text:"888"
                    font.pointSize: 10

                }

                Text{
                    text: "m"
                    font.pointSize: 10
                }
            }
        }                    //End of Column


    }
    
    
    Button{
        text: "Send"

        onClicked:
        {
            console.log("VAL1",val1.text)   //ReferenceError: val1 is not defined,
            console.log("VAL2",val2.text)
            console.log("SEND")

        }
    }
}

i get this output

qml: VAL1 777
qml: VAL2 888
qml: SEND

and no error

ODБOï

@sush123
i managed to reproduce the error by defining InputRow like this :
//InputRow.qml

import QtQuick 2.0
import QtQuick.Layouts 1.12

RowLayout{
    property alias inputContent : content // i use this to access the loader.item
    
    property var component
    Loader{
        id:content
        Layout.fillHeight: true
        Layout.fillWidth: true
        sourceComponent:component
    }
}

and use it

component : Component{
            id: userInput
            Column{...}
}

then the only way i found to access val1 is this
userInput.inputContent.item.children[0].children[1].text
but this is too ugly ^^

But i have another idea, one solution that will work in any case for sure, no matter how your InputRow is defined
simply create 2 properties, and assign them when the TextInput text changes

InputRow{
       id: userForm
       property var userInput1
       property var userInput2

       component : 
           Column{
...
          TextInput {
                   id:val1
                   text: "777"
                   onTextChanged: userForm.userInput1 = text
                   Component.onCompleted : userForm.userInput1 = text 
               }
           }
Button{
   onClicked : console.log(userForm.userInput1)
}

only drawback is that you create 2 additional variables

sush123

This post is deleted!