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

QML ComboBox doesn't add text from its dropdown list to the text area



  • Hi,
    I have the following code which displays its dropdown list from a db. When I choose an item from the list the text is highlighted for a moment, the dropdown closes but the chosen text is not copied to the text area.
    The code:

    import QtQuick 2.9
    import QtQuick 2.0
    import VPlayApps 1.0
    import QtQuick.Controls 1.4
    import QtQuick.Controls 2.2
    import QtQuick.Controls.Styles 1.4
    import QtQuick.Layouts 1.3
    import QtQuick.LocalStorage 2.0
    import QtQml.Models 2.3
    import "Database.js" as JS
    import "Dropboxes.js" as DB
    
    App {
        Rectangle {
            id: root
            color: "#a1d9ea"
            anchors.fill: parent
            focus: false
    
            Text {
                id: title
                text: "Combobox"
                font.pixelSize: 25
                anchors.horizontalCenter: root.horizontalCenter
                anchors.top: root.top
                anchors.topMargin: 30
            }
    
            ComboBox {
                id: whatCombo
                anchors.horizontalCenter: title.horizontalCenter
                anchors.top: title.bottom
                anchors.topMargin: 30
                editable: true
                textRole: "text"
                height: 50
                width: 230
                model: ListModel {
                    id: listModel
                }
    
                delegate: ItemDelegate {
                    width: whatCombo.width
                    height: whatCombo.height
                    text: model.what
                    font.pixelSize: 18
                }
            }
    
            Component.onCompleted: {
                var db = JS.dbGetHandle()
                db.transaction(function (tx) {
                    var results = tx.executeSql(
                                'SELECT what FROM dropboxWhatIs order by what desc')
                    for (var i = 0; i < results.rows.length; i++) {
                        listModel.append({
                                             what: results.rows.item(i).what,
                                             checked: ""
                                         })
                    }
                })
            }
        }
    }
    
    

    Am I missing something?
    Thank you for your help.



  • @gabor53 Hi, you need to bind text with the current value of the combobox:

    Text {
        ...
        text: whatCombo.currentText
        ...
    }
    


  • Hi @Gojir4,

    The problem is that when I click on a dropdown item it is either

    • not actually chosen or

    • chosen, but it doesn't appear in the combobox text area.
      Your recommendation works right after there is an item chosen and it appears in the combobox's editable text area.



  • @gabor53 Do you mean that clicking on an item doens't always change currentText ?



  • @Gojir4
    Yes. Actually never does. It is always empty.



  • @gabor53 You can try with that:

    delegate: ItemDelegate {
        ...
        onClicked: whatCombo.currentIndex = index
        highlighted: control.highlightedIndex === index 
    }
    

    I'm surprised it's not selected automatically.



  • @gabor53 said in QML ComboBox doesn't add text from its dropdown list to the text area:

    textRole: "text"

    Again, you don't have a role text in your model. It should be what since you use:

     listModel.append({
        what: results.rows.item(i).what,
        checked: ""
    })
    


  • Hi @Diracsbracket ,
    Thank you. I changed it and it works perfectly.


Log in to reply