Cannot Append on ListModel need Help



  • i am trying to a append on a listmodel that was empty on 2 qml file (connectbox, favorytestyle)
    for the connectbox it was success with no problem
    but for the other file
    for first attempt (first append) it was success
    but on the second (the next append) the item won't showed up on the listview / gridview
    these file have almost same code for listview / gridview, model, and delegate

    here is the code :
    connectbox.qml
    @Item {
    id: connectbox
    Item {
    VisualDataModel {
    id: dataModel
    model: ListModel{
    id:innerModel
    }

                //server name
                delegate: Item {
                    width: serverGrid.width
                    height: 40
    
                    Row {
                        anchors.fill: parent
                        Text {
                            id: itemServerName
                            width: parent.width / 3
                            height: parent.height
                            text: sourceName
                        }
                        Text {
                            id: itemServerUrl
                            width: parent.width - itemServerName.width
                            height: parent.height
                            text: sourceUrl
                        }
                    }
    
                    //area click to choose server
                    MouseArea {
                        anchors.fill: parent
                        onClicked: {
                            selectedServerName = itemServerName.text
                            selectedServerUrl = itemServerUrl.text
                            connectBox.state = "select"
                        }
                    }
                }
            }
    
            //state for adding the list via database
            states: [
                State {
                    name: "addItem"
                    when: connectBox.state == "add"
                    StateChangeScript {
                        script: {
                            //connect database SQL lite
                            var db = openDatabaseSync("DmixmatchDB", "1.0", "Dmixmatch Database", 1000000);
    
                            //SQL command
                            db.transaction(
                                function(tx) {
                                    // Create Table 
                                    tx.executeSql('CREATE TABLE IF NOT EXISTS ServerList(serverName TEXT, serverUrl TEXT)');
    
                                    // Cek duplicate list
                                    var rs = tx.executeSql('SELECT * FROM ServerList WHERE serverName LIKE "%'+ connectBox.selectedServerName +'%"');
    
                                    if(rs.rows.length > 0) {
                                        // update data 
                                        tx.executeSql('UPDATE ServerList SET serverUrl = "'+connectBox.selectedServerUrl+'" WHERE serverName LIKE "%'+ connectBox.selectedServerName +'%"');
                                    }
                                    else {
                                        //insert data
                                        tx.executeSql('INSERT INTO ServerList VALUES(?, ?)', [ connectBox.selectedServerName, connectBox.selectedServerUrl ]);
                                    }
    
                                    rs = tx.executeSql('SELECT * FROM ServerList');
                                    innerModel.clear()
                                    for(var i = 0; i < rs.rows.length; i++) {
                                        innerModel.append({"sourceUrl": rs.rows.item(i).serverUrl,"sourceName": rs.rows.item(i).serverName})
                                    }
                                }
                            )
                        }
                    }
                }
            ]
        }
    
        //label server list
        Text {
            id: titleServerList
            anchors.left: parent.left
            anchors.top: buttonCancel.bottom
            width: parent.width
            text: "Recent Server : "
        }
    
        //list server
        ListView {
            id: serverGrid
            anchors.top: titleServerList.bottom
            anchors.left: parent.left
            anchors.bottom: parent.bottom
            width: parent.width
            model: dataModel
        }
    
        State {
            name: "show"
            PropertyChanges {
                target: connectBox
                opacity: 1
            }
            StateChangeScript {
                script: {
                    var db = openDatabaseSync("DmixmatchDB", "1.0", "Dmixmatch Database", 1000000);
    
                    //SQL command
                    db.transaction(
                        function(tx) {
                            // load list server
                            var rs = tx.executeSql('SELECT * FROM ServerList');
    
                            innerModel.clear()
                            for(var i = 0; i < rs.rows.length; i++) {
                                innerModel.append({"sourceUrl": rs.rows.item(i).serverUrl,"sourceName": rs.rows.item(i).serverName})
                            }
    
                        }
                    )
                }
            }
        }@


  • favoritestyle.qml
    @Item {
    id:favoritestyle
    GridView {
    id: clothesGrid
    anchors.top: buttonFitRoom.bottom
    anchors.left: parent.left
    cellHeight: height / 3
    cellWidth: width / 3

        VisualDataModel {
            id: dataModel
            model: ListModel{
                id:innerModel
            }
    
            
            delegate: Item {
                id: favoriteDelegate
                width: clothesGrid.cellWidth; height: clothesGrid.cellHeight
    
                property string itemFlag: indx
    
                Column {
                    anchors.fill: parent
                    Image {
                        id: index1
                        width: parent.width
                        height: parent.height / 2
                        source: source1
                    }
                    Image {
                        id: index2
                        width: parent.width
                        height: parent.height / 2
                        source: source2
                    }
                }                
            }
        }
    
        model: dataModel
    }
    
    Button {
        id: buttonAddStyle
        anchors.bottom: parent.bottom
        anchors.left: buttonReset.right
        text: "Add"
        onClicked: {
            var db = openDatabaseSync("DmixmatchDB", "1.0", "Dmixmatch Database", 1000000);
    
            //SQL command
            db.transaction(
                function(tx) {
                    // Create Table jika blom ada
                    tx.executeSql('CREATE TABLE IF NOT EXISTS FavoriteStyle(flag TEXT, image1 TEXT, image2 TEXT)');
    
                    var rs = tx.executeSql('SELECT * FROM FavoriteStyle');
                    var flag = rs.rows.length
                    //insert ke database
                    tx.executeSql('INSERT INTO FavoriteStyle VALUES(?, ?, ?)', [ flag ,index1.source, index2.source ]);
    
                    rs = tx.executeSql('SELECT * FROM ServerList');
                         innerModel.clear()
                         for(var i = 0; i < rs.rows.length; i++) {
                               innerModel.append({"sourceUrl": rs.rows.item(i).serverUrl,"sourceName": rs.rows.item(i).serverName})
                         }                
                }
            )
    
            fitRoom.state = "hideslide"
            favoriteStyle.state = "showslide"
        }
    }
    
    State {
            name: "show"
            PropertyChanges {
                target: favoriteStyle
                opacity: 1
            }
            StateChangeScript {
                script: {
                    var db = openDatabaseSync("DmixmatchDB", "1.0", "Dmixmatch Database", 1000000);
    
                    //SQL command
                    db.transaction(
                        function(tx) {
                            var rs = tx.executeSql('SELECT * FROM FavoriteStyle');
    
                            innerModel.clear()
                            for(var i = 0; i < rs.rows.length; i++) {
                                    innerModel.append({"indx": rs.rows.item(i).flag,"source1": rs.rows.item(i).image1,"source2": rs.rows.item(i).image2})
                            }
                        }
                    )
                }
            }
        }
    

    }
    @

    Connectbox :
    in connectbox whenever user input a new server it will insert those server to database
    en when state show triggered it will show all available server that has been inserted via listview

    FavStyle :
    favstyle will be added via button
    and the images source url will be saved via database
    when state changed to show
    it will show all saved style from database

    thx before
    regards reedwine


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.