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

changing combobox index when selection of another combobox is changed



  • Basically I have 2 comboboxes in qml. When the first combobox is changing to a specific value a second combobox has to be adjusted. I tried to use a function and check a number of different comboboxes and try to make the adjustment, but that fails.

    Is there somewhere an example, I could not find yet?



  • Hi @koahnig , i did not get it completely:-

    1. are you facing a problem to fetch the value of the first combo box?
    2. or do you want to know whether the currentIndex of the first combo box has changed?
      3.or do you want to change the value of the second combo box, when you click on the first combo box and hover over the values to change.

  • Moderators

    @koahnig

    you mean like this ?

    import QtQuick 2.12
    import QtQuick.Controls 2.5
    
    ApplicationWindow {
      visible:true
      width:500; height:500
    
    
        ComboBox {
          id: box1
          anchors.left: parent.left
          anchors.right: parent.right
          anchors.top:parent.top
          height: parent.height /2
    
          model: ["0","1", "2", "3", "4"]
          onCurrentIndexChanged: box2.currentIndex = currentIndex
        }
    
        ComboBox {
          id: box2
          anchors.left: parent.left
          anchors.right: parent.right
          anchors.top:box1.bottom
          height: parent.height /2
    
          model: [10,11,12,13,14]
    
          onCurrentIndexChanged: box1.currentIndex = currentIndex
        }
    }
    


  • @Shrinidhi-Upadhyaya

    ComboBox {
                            id:sol0types
                            currentIndex: 2
                            model: [ "1", "5", "1/5", "IF" ]
                            width: parent.width*rect3.myTypScale
                            height: rect3.myHeight
                            onCurrentTextChanged: {
                                settings3.colorButton() 
                            }
                        }
                        ComboBox {
                            id: sol0allonly
                            currentIndex: 0
                            font.pointSize: 13
                            model: [ "all", "only" ]
                            width: parent.width*rect3.myAllScale
                            height: rect3.myHeight
                            onCurrentTextChanged: {settings3.colorButton()
                                settings3.checkSettings() }
                        }
    

    Those are my comboboxes when the first "id:sol0types" is changed to "IF", the second needs to be changed to "only".
    checkSettings does not do the job.

    Below is the checkSettings function

                    function checkSettings()
                    {
                        console.log( "checkSettings" )
                        console.log(sol0types.currentText, " sol0 index ", sol0allonly.currentIndex )
                        if ( sol0types.currentText == "IF" )
                        {
                            sol0allonly.currentIndex = 2
                        }
                        if ( sol1types.currentText == "IF" )
                        {
                            sol1allonly.currentIndex = 1
                        }
                        if ( sol2types.currentText == "IF" )
                        {
                            sol2allonly.currentIndex = 1
                        }
                        if ( sol3types.currentText == "IF" )
                        {
                            sol3allonly.currentIndex = 1
                        }
                    }
    

  • Moderators

    @koahnig

    adjusting my crude example to your actual code:

    ComboBox {
                            id:sol0types
                            currentIndex: 2
                            model: [ "1", "5", "1/5", "IF" ]
                            width: parent.width*rect3.myTypScale
                            height: rect3.myHeight
                            onCurrentTextChanged: {
                                settings3.colorButton() 
                            }
                           onCurrentIndexChanged: {
                              if( currentIndex == 3 )   
                                   sol0allonly.currentIndex = 1
                           }
                        }
                        
    

    right ?


  • Moderators

    @koahnig

    I think your logic isn't quite right, if the 2nd ComboBox should change when the first one is set to IF, shouldn't you be calling setting in the text changed signal of the first combobox ?

    You currently only call it in the 2nd and that should change.

    and you're settings the current index to sol0allonly.currentIndex = 2 when it only has 2 entries in the model


    ApplicationWindow {
      visible:true
      width:500; height:500
    
    
        ComboBox {
            id:sol0types
            currentIndex: 2
            model: [ "1", "5", "1/5", "IF" ]
            width: parent.width
            height: parent.height /2
            onCurrentTextChanged: {
                console.log("sol0types changed", currentText)
                sol0allonly.checkSettings()
            }
        }
    
        ComboBox {
            id: sol0allonly
            currentIndex: 0
            font.pointSize: 13
            model: [ "all", "only" ]
            width: parent.width
            height: parent.height /2
            y:parent.height/2
            onCurrentTextChanged: {
                checkSettings()
            }
    
            function checkSettings(){
                console.log( "checkSettings" )
                console.log(sol0types.currentText, " sol0 index ", sol0allonly.currentIndex )
                if ( sol0types.currentText === "IF" )
                {
                    sol0allonly.currentIndex = 1
                }
    
            }
        }
    }
    


  • @J.Hilk

    Sorry, was changing code based on your example.

                            onCurrentTextChanged: {
                                settings3.colorButton() 
                                sol0allonly.currentIndex = currentIndex == 3 ? 1 : sol0allonly.currentIndex
                            }
    

    That is working.
    I'll change to your version. Elegance of code is not my main focus at the moment ;)

    I am checking with the other combobox at the moment. I shall go back to only. That is not working yet.



  • @J.Hilk said in changing combobox index when selection of another combobox is changed:

    @koahnig

    I think your logic isn't quite right, if the 2nd ComboBox should change when the first one is set to IF, shouldn't you be calling setting in the text changed signal of the first combobox ?

    You currently only call it in the 2nd and that should change.

    and you're settings the current index to sol0allonly.currentIndex = 2 when it only has 2 entries in the model

    That was a leftover from my desperate trials.

    Probably a really stupid question: Why do I need "===" and not "==" ?
    It complained before to change to "===" but I had basically forgotten to use also .currentText
    Not sure if there was an update issue with all that. But I think I had covered what does work now. In the mean time creator crashed and the new session may have helped magically.

    And I love C++!!!

    My solution is now:

                        ComboBox {
                            id:sol0types
                            currentIndex: 2
                            model: [ "1", "5", "1/5", "IF" ]
                            width: parent.width*rect3.myTypScale
                            height: rect3.myHeight
                            onCurrentTextChanged: {
                                settings3.colorButton() 
                                if ( currentIndex == 3 )
                                    sol0allonly.currentIndex = 1
                            }
                        }
                        ComboBox {
                            id: sol0allonly
                            currentIndex: 0
                            font.pointSize: 13
                            model: [ "all", "only" ]
                            width: parent.width*rect3.myAllScale
                            height: rect3.myHeight
                            onCurrentTextChanged: {
                                settings3.colorButton()
                            }
                            onCurrentIndexChanged: {
                                if ( sol0types.currentIndex == 3 )
                                    currentIndex = 1
                            }
                        }
    

    That is working HURRAY!!

    The problem is also that the debugger is not working with the Android level on my two phones.

    Thanks to all for your suggestions.


  • Moderators

    @koahnig said in changing combobox index when selection of another combobox is changed:

    Probably a really stupid question: Why do I need "===" and not "==" ?

    Because you want to be really really sure that they are equal x)

    No, JavaScript does conversion checks as well

    "1" == 1 -> true
    "1" === 1 -> false

    And I love C++!!!

    hear,hear!


Log in to reply