use of Rectangle javascript

[anda_skoa]

And you are posting this why?

To show that a list of strings is not a string in case anyone would think that?

Cheers,
_

[ravandi]

I did try. but , it didn't work.

import QtQuick 2.3
import QtQuick.LocalStorage 2.0
import QtQuick.Controls 1.1
Rectangle {
 id: page2
 property var word:[]
    width: 360
    height: 360
 
    Column {	
        id: row
        spacing: 5; 
 
       Component.onCompleted:{			 		 
            var db = LocalStorage.openDatabaseSync("ravandi", "1.0", "The Example QML SQL!", 1000000);
            db.transaction(
                function(tx) {
                    tx.executeSql('CREATE TABLE IF NOT EXISTS jadval(id integer primary key autoincrement not null,`name` varchar(40),`last` varchar(40))');
                    tx.executeSql("insert into jadval (name,last) values('reza','ravandi')");
                    var rs = tx.executeSql('SELECT * FROM jadval');
		for(var i = 0; i < rs.rows.length; i++) {		
		word.push(rs.rows.item(i).name);
		print(word)
                    }
                }
            )			
        }
 
        Repeater {
	id: repeater
            model: word;
            delegate: Rectangle {
		width:100
		height:30
		border.color: "red"
		border.width: 1	
		Text{
			id:matn
			anchors.centerIn: parent
			 text: modelData
		}
            }
        }
    }
}

import QtQuick 2.3
import QtQuick.LocalStorage 2.0
import QtQuick.Controls 1.1
Rectangle {
 id: page2
 property var word:[]
    width: 360
    height: 360

    Column {	
        id: row
        spacing: 5; 
		
       Component.onCompleted:{			 		 
            var db = LocalStorage.openDatabaseSync("ravandi", "1.0", "The Example QML SQL!", 1000000);
            db.transaction(
                function(tx) {
                    tx.executeSql('CREATE TABLE IF NOT EXISTS jadval(id integer primary key autoincrement not null,`name` varchar(40),`last` varchar(40))');
                    tx.executeSql("insert into jadval (name,last) values('reza','ravandi')");
                    var rs = tx.executeSql('SELECT * FROM jadval');
		for(var i = 0; i < rs.rows.length; i++) {		
		word.push(rs.rows.item(i).name);
		print(word)
                    }
                }
            )			
        }
 
        Repeater {
	id: repeater
            model: word;
            delegate: Rectangle {
		width:100
		height:30
		border.color: "red"
		border.width: 1	
		Text{
			id:matn
			anchors.centerIn: parent
			 text: modelData
		}
            }
        }
    }
}

To copy to clipboard, switch view to plain text mode 

[anda_skoa]

One important thing about programming is to not change code randomly at many places at the same time.

You could have just fixed your code from comment #7 by using the correct property as the model instead of a totally unrelated one.
But instead you changed how you fill the property and rename the property and fix the use of the property as a model.

With your process you can only end up with working code by pure luck, if one of the many changes you make fixes the problem and all other random changes do not break new things.

Oh and "it didn't work" is not a good description since it doesn't say what happend or did not happen.

So:
- fill a variable with the strings
- assign that to the property you intend to use as the Repeater's model
- use that property as the model, not some random other property


Cheers,
_

[ravandi]

The problem was solved:

import QtQuick 2.3
import QtQuick.LocalStorage 2.0
import QtQuick.Controls 1.1
Rectangle {
 id: page2
 property var word:new Array
 property var namee:new Array
 
    width: 360
    height: 360
 
    Column {	
        id: row
        spacing: 5; 
 
       Component.onCompleted:{			 		 
            var db = LocalStorage.openDatabaseSync("ravandi", "1.0", "The Example QML SQL!", 1000000);
            db.transaction(
            function(tx) {
            tx.executeSql('CREATE TABLE IF NOT EXISTS jadval(id integer primary key autoincrement not null,`name` varchar(40),`last` varchar(40))');
            tx.executeSql("insert into jadval (name,last) values('mohammad reza','ravandi')");
            var rs = tx.executeSql('SELECT * FROM jadval');
		for(var i = 0; i < rs.rows.length; i++) {		
		namee  =rs.rows.item(i).name
		word.push(namee);
		print(word)
        }
 
		repeater.model = word
                }
            )
 
        }
 
        Repeater {
	id: repeater
        model: word;
        delegate: Rectangle {
		width:100
		height:30
		border.color: "red"
		border.width: 1	
			Text{
				id:matn
				anchors.centerIn: parent
				text: modelData
			}
            }
        }
    }
}

import QtQuick 2.3
import QtQuick.LocalStorage 2.0
import QtQuick.Controls 1.1
Rectangle {
 id: page2
 property var word:new Array
 property var namee:new Array

    width: 360
    height: 360

    Column {	
        id: row
        spacing: 5; 
		
       Component.onCompleted:{			 		 
            var db = LocalStorage.openDatabaseSync("ravandi", "1.0", "The Example QML SQL!", 1000000);
            db.transaction(
            function(tx) {
            tx.executeSql('CREATE TABLE IF NOT EXISTS jadval(id integer primary key autoincrement not null,`name` varchar(40),`last` varchar(40))');
            tx.executeSql("insert into jadval (name,last) values('mohammad reza','ravandi')");
            var rs = tx.executeSql('SELECT * FROM jadval');
		for(var i = 0; i < rs.rows.length; i++) {		
		namee  =rs.rows.item(i).name
		word.push(namee);
		print(word)
        }
					
		repeater.model = word
                }
            )
			 
        }
 
        Repeater {
	id: repeater
        model: word;
        delegate: Rectangle {
		width:100
		height:30
		border.color: "red"
		border.width: 1	
			Text{
				id:matn
				anchors.centerIn: parent
				text: modelData
			}
            }
        }
    }
}

To copy to clipboard, switch view to plain text mode 

[anda_skoa]

And you are needlessly using namee, also needlessly initializing it as an array.

But nice to see that randomly changing code will sometimes lead to a solution as well.
It only took two weeks longer then necessary. Maybe something you should think about.

Cheers,
_

[ravandi]

I would like to show the values field Last also.

import QtQuick 2.3
import QtQuick.LocalStorage 2.0
import QtQuick.Controls 1.1
Rectangle {
 id: page2
 property var word:new Array
 property var namee:new Array
 
    width: 360
    height: 480
 
    Column {         
        id: row
        spacing: 5;
 
       Component.onCompleted:{                                                                
            var db = LocalStorage.openDatabaseSync("ravandi", "1.0", "The Example QML SQL!", 1000000);
            db.transaction(
            function(tx) {
            tx.executeSql('CREATE TABLE IF NOT EXISTS jadval(id integer primary key autoincrement not null,`name` varchar(40),`last` varchar(40))');
            //tx.executeSql("insert into jadval (name,last) values('mohammad reza','ravandi')");
            var rs = tx.executeSql('SELECT * FROM jadval');
                for(var i = 0; i < rs.rows.length; i++) {                      
                    namee  =rs.rows.item(i).name
                    word.push(namee); 
                    // print(word)
        }                                                                               
                repeater.model = word
                }
            )
 
        }
 
        Repeater {
          id: repeater
        model: word.count;
        delegate: Rectangle {
            width:200
            height:30
            border.color: "red"
            border.width: 1
            Text{
                id:matn
                anchors.centerIn: parent
                // text:show values field name
            }
            Text{
                id:matn2
                //text:show values field last
            }												
            }
        }
    }
}

import QtQuick 2.3
import QtQuick.LocalStorage 2.0
import QtQuick.Controls 1.1
Rectangle {
 id: page2
 property var word:new Array
 property var namee:new Array
  
    width: 360
    height: 480
  
    Column {         
        id: row
        spacing: 5;
                                
       Component.onCompleted:{                                                                
            var db = LocalStorage.openDatabaseSync("ravandi", "1.0", "The Example QML SQL!", 1000000);
            db.transaction(
            function(tx) {
            tx.executeSql('CREATE TABLE IF NOT EXISTS jadval(id integer primary key autoincrement not null,`name` varchar(40),`last` varchar(40))');
            //tx.executeSql("insert into jadval (name,last) values('mohammad reza','ravandi')");
            var rs = tx.executeSql('SELECT * FROM jadval');
                for(var i = 0; i < rs.rows.length; i++) {                      
                    namee  =rs.rows.item(i).name
                    word.push(namee); 
                    // print(word)
        }                                                                               
                repeater.model = word
                }
            )
                                                  
        }
  
        Repeater {
          id: repeater
        model: word.count;
        delegate: Rectangle {
            width:200
            height:30
            border.color: "red"
            border.width: 1
            Text{
                id:matn
                anchors.centerIn: parent
                // text:show values field name
            }
            Text{
                id:matn2
                //text:show values field last
            }												
            }
        }
    }
}

To copy to clipboard, switch view to plain text mode 

[anda_skoa]

For that I would recommend switching to a ListModel instead of the array.

1) Create a ListModel with an id and use that id as the Repeater's model
2) Add some ListElement entries to the model that have the two data fields. That allows you to test the delegate with some fixed data
3) Remove those entries again and modify your data gathering loop to call append() on the model instead of pushing to the array.

Cheers,
_

[ravandi]

I already values append () in javascript the empty() was empty.
But I do not know how empty it in qml?
please guide me!

[anda_skoa]

But I do not know how empty it in qml?

"it" being the ListModel instance?
ListModel has a clear() method, easily discoverable by looking at the documentation.

Cheers,
_