Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Custom Component



  • This post is deleted!


  • This post is deleted!


  • @sush123 hi

    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



  • @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



  • This post is deleted!

Log in to reply