Update ListView with onClicked [solved]



  • I'm using this to show contents of a database
    @
    import "test.js" as Logic
    .......
    ...........
    Text {
    id: text1
    x: 100
    y: 100
    text: qsTr(Logic.r)
    opacity: 0
    font.pixelSize: 12
    }
    ListView {
    id: logic_rs
    x: 455
    y: -47
    model: Logic.get_db(5,0)
    delegate: Text{
    text: qsTr(Logic.r)}
    }
    @
    What I would like to do is be able to update is list with the next 5 elements from the database
    Here is my failed attempt
    @
    onClicked:{
    Logic.index_count = Logic.index_count+5
    logic_rs=Logic.index_count

                    }
    

    @

    My main goal is: I have a (large) list of items only 5 at a time are shown, there are next and prev button which show the next 5 items or the prev 5 items.

    Here is my js for getting the data
    @
    var index_count = 0
    var up_check = 0
    var r = ""
    function get_db(a, up_check) {

    var db = LocalStorage.openDatabaseSync("DB5", "1.0", "The Example QML SQL!", 1000000);
    db.transaction(
    function(tx) {
    /* tx.executeSql('CREATE TABLE IF NOT EXISTS Greeting(salutation TEXT, salutee TEXT)');
    for ( var z=0; z<1000; z++){
    tx.executeSql('INSERT INTO Greeting VALUES(?, ?)', [ 'Movie', z ]);
    }
    */
    var rs = tx.executeSql('SELECT * FROM Greeting');
    r = ""
    for(var i = 0; i < a; i++) {
    if (i>index_count-1 && up_check ===0)
    r += rs.rows.item(i).salutation + ": " + rs.rows.item(i).salutee + "\t\t"
    if (up_check === 1){
    var size_check =0
    if (i >index_count-11 && size_check !==9) {
    r += rs.rows.item(i).salutation + ": " + rs.rows.item(i).salutee + "\t\t"
    size_check++
    }
    }
    }
    console.log(r);
    index_count=a;
    })}
    @



  • Perhaps you should try doing the paging in the SQL Query instead. Something like explained here:

    http://stackoverflow.com/questions/14468586/how-paging-with-sqlite-with-millions-of-records

    You could for instance use the ID (if it is increasing for every new row) as the SomeColumn value and store that in your code.

    I hope this might help you out.



  • Thanks I'll def. be using that instead.

    My main problem is I cannot get the content from the database to update on screen like in the console.



  • OK, I'm not totally sure about this, but I think that in your ListView, the model will be constant:

    @ListView {
    id: logic_rs
    x: 455
    y: -47
    model: Logic.get_db(5,0)
    delegate: Text{
    text: qsTr(Logic.r)}
    }@

    So what you need is something like:

    @ListView {
    id: logic_rs
    x: 455
    y: -47
    model: someModel
    delegate: Text{
    text: qsTr(Logic.r)
    }
    }

    var someModel;
    function updateList(size){
    someModel = Logic.get_db(size,0)
    }
    @

    And then you run the updateList() function in the onClick or whatever.



  • Thanks! that makes total sense but I'm getting an error
    @JavaScript declaration outside Script element@



  • Yea, I guess it is line 11 in my example: var someModel; It was just an example, and I don't remember the best way to solve this, but you could perhaps have the var someModel in a javascript file that you include, or If I remember correctly you could just declare a property in your QML file:

    @property variant someModel;@



  • Thank you making it a global QML worked!

    but it only shows the content from the database in the terminal not the app



  • Do you have a return statement in your function that should return the updated database model?

    Im not sure if the code in the OP is up to date anymore, but I don't see a return statement.


Log in to reply
 

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