如何从QML表中删除特定行

时间:2014-07-31 10:43:31

标签: qml qt-quick

我正在使用QML Tableview,我创建了一个模型来填充QML表中的数据。当我按下“新行数据”按钮时,我能够在表格行中成功填写数据,我还可以使用“删除行”工具按钮从表格中删除行。

现在我面临以下问题:

我想通过使用向上和向下按钮选择将通过“删除行”按钮删除的行。 所以请告诉我如何使用向上和向下工具按钮选择表行条目以及如何获取所选行的索引,因此通过按删除按钮我可以从表中删除该特定选定行。

我试过Listview.currentIndex,但它没有用?

     import QtQuick 2.2
    import QtQuick.Controls 1.2
    import QtQuick.Layouts 1.0
    import QtQuick.Dialogs 1.0


Item {
id:root
       anchors.fill: parent
       anchors.margins: 8

       Component {
id: comboDelegate

        ComboBox {
editable:true
model: ListModel {
            ListElement { text: "checkbox" }
            ListElement { text: "edit" }
            ListElement { text: "anyotheroption" }
         }
    }
   }



   Component {
id: comboDelegatetext
        Text {
text: itemText
    }
   }


   ColumnLayout {
id: mainLayout
        anchors.fill: parent
spacing: 4


         GroupBox {
id: gridBox
title: "Grid layout"
       Layout.fillWidth: true


       GridLayout {
id: gridLayout
        anchors.fill: parent
rows: 4
flow: GridLayout.TopToBottom

      ToolButton {  iconSource: "../images/window-new.png"
      Accessible.name: "create a new row"
onClicked: {
    myModel.append({prompt: "pmpt", variable:"LINEDIT",tabname:"TABNAME"})
        console.log(ListView.currentIndex)
    }
tooltip: "creaate a new row" }

    ToolButton { iconSource: "../images/up.png"
onClicked:{

    tableview.selection.forEach( function(rowIndex) {console.log(rowIndex)} )
    }
tooltip: "go up" }

    ToolButton { Accessible.name: "Save as"
iconSource: "../images/down.png"
tooltip: "go down." }

    ToolButton {
iconSource: "../images/process-stop.png"

onClicked: {
        myModel.remove(ListView.currentIndex)
            //console.log(tablemodel.currentIndex)
            }
tooltip: "Delete the row" }



            TableView{
id: tablemodel
        Layout.rowSpan: 4
        Layout.fillHeight: true
        Layout.fillWidth: true
alternatingRowColors: true

                      //anchors.fill: parent

                      TableViewColumn {
role: "index"
title: "#"
width: 35
resizable: false
movable: false
    }
    TableViewColumn {
role: "prompt"
title: "Prompt"
width: 120
       delegate: Component {
id: codeDelegate
        TextEdit {
visible:true
text: ""

    }
      }
    }

    TableViewColumn {
role: "variable"
title: "Variable"
width: 120
       delegate: Component {
id: codeDelegate1
        TextEdit {
text: ""


    }
      }
    }
    TableViewColumn {
role: "type"
title: "Type"
width: 200
visible: true
    }
    TableViewColumn {
role: "tabname"
title: "Tab Name"
       Layout.fillWidth: true
visible: true
    }
model: ListModel {

id: myModel
       }
itemDelegate: Item {
height: 20
            Loader {
                Loader {
                    property string itemText: styleData.value
sourceComponent: styleData.column === 3 ? comboDelegate : comboDelegatetext
                }
        }
              }



            }
    }
    }



    Rectangle{
        Layout.fillHeight: true
            Layout.fillWidth: true
            GridLayout {
                //id: gridLayout
rows: 1
flow: GridLayout.TopToBottom
      anchors.fill: parent
      GridLayout{
id: grid1
columns: 2
         anchors.fill: parent
         GroupBox {
             //id: gridBox
title: "Grid layout"
           Layout.fillHeight: true
           Layout.fillWidth: true
    }
    GroupBox {
        //id: gridBox
title: "Grid layout"
           Layout.fillHeight: true
           Layout.fillWidth: true
    }
      }

        }
    }
   }
}

1 个答案:

答案 0 :(得分:0)

解决方案非常简单,因为您没有更改currentRow的{​​{1}}属性

TableView