Qt Forum

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Unsolved

    Qt Academy Launch in California!

    Manipulating a model inside a ListView with Javascript

    QML and Qt Quick
    2
    3
    2674
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • T
      tobias.renz last edited by

      Hi Everybody,

      I want to remove an element from a model inside of a ListView with JavaScript.

      @
      ListView {
      id: storageListView
      model: storageModel
      }
      @

      If I manipulate items inside the model it works (e.g. my elements in the model have a property named show):

      listView.model[listView.currentIndex].show = true

      => The ListView updates

      Now I would want to remove an item directly e.g. I tried to use the remove function from ListModel qml element but I doesn't work. The method is not known.

      @listView.model.remove(listView.currentIndex)@

      Also I tried to use javascript array method on listView.model since I access it is accessed like a javascript array (see example with show property above). But It doesn't work either:

      @listView.model.splice(listView.currentIndex, 1)@

      It is important to me to manipulate the model inside of ListView and not manipulating my model outside of listView and the setting it new with something like:

      @
      listView.model = myManipulatedModel
      @

      The reason is: If I set the model to a new model the ListView will reposition elements in an unwanted way.

      Any help here would be much appreciated :).

      Tobias

      1 Reply Last reply Reply Quote 0
      • F
        favoritas37 last edited by

        The above functions that you mention are working correctly for ListModel components.

        So if i were you, i would try to avoid the referencing of the model through the listView model and use it directly. Meaning of which, try to call

        @
        listView.model.remove(listView.currentIndex)
        @

        by using direct reference to the model
        @
        modelReference.remove(listView.currentIndex)
        @

        1 Reply Last reply Reply Quote 0
        • T
          tobias.renz last edited by

          Thanks very much for your reply :)!

          I guess you are refering to the following:

          @
          ListView {
          id: storageListView
          model: storageModel
          }

          ListModel {
          id: storageModel
          ListElement {
          name: "Apple"
          cost: 2.45
          show: true
          }
          ListElement {
          name: "Orange"
          cost: 3.25
          show: true
          }
          ListElement {
          name: "Banana"
          cost: 1.95
          show: true
          }
          }
          @

          storageModel.remove(listView.currentIndex)

          => This would work in order to remove the element. But storageModel (which is an id not a reference) is given to ListView with a property binding:

          @
          model: storageModel
          @

          This means that if I manipulate storageModel it will emit a change which will lead to the reevaluation of the model property binding and the storageModel will be copied over to the model property of listView. QML isn't working with references here (one could say unfortunatly but it has advantages as well ;)).

          Then as I said: It is important to me to manipulate the model inside of ListView and not manipulating my model outside of listView and the setting it new. Which is what I described above.

          The reason is that If I the model updates and is copied over to the ListView model there will be a refresh to the listView. The listView positions itself at index 0 and then back to currentIndex. But the currentIndex Element will e.g. not be in the middle of listView but at the bottom afterwards.

          But thanks again for taking the time to reply.

          Tobias

          1 Reply Last reply Reply Quote 0
          • First post
            Last post