Search in Qml ListView contact model - filter

Question

What I have is a listview, to show list of contacts. Also, there is a search box and a label. Based on the text typed in the search box, the contact list will be filtered.
Here is my code:
import QtQuick 1.1
import com.nokia.symbian 1.1
import com.nokia.extras 1.1
import QtMobility.contacts 1.1
Window {
id: window
StatusBar {
id: statusBar
anchors.top: window.top
Text {
id: statusBarTitle
text: "Contacts"
color: "#ffffff"
}
}
ContactModel {
id: contactModel
filter:
IntersectionFilter {
DetailFilter {
detail: ContactDetail.PhoneNumber
field: PhoneNumber.PhoneNumber
value: PhoneNumber.Mobile
}
UnionFilter {
DetailFilter {
detail: ContactDetail.Name
field: Name.FirstName
value: searchbox.searchText
matchFlags: Filter.MatchStartsWith
}
DetailFilter {
detail: ContactDetail.Name
field: Name.LastName
value: searchbox.searchText
matchFlags: Filter.MatchStartsWith
}
DetailFilter {
detail: ContactDetail.DisplayLabel
field: DisplayLabel.Label
value: searchbox.searchText
matchFlags: Filter.MatchStartsWith
}
}
}
sortOrders:
SortOrder {
detail: ContactDetail.Name
field: Name.FirstName
direction: Qt.AscendingOrder
}
}
Component {
id: contactListDelegate
ListItem {
id: listItem
Image {
id: avatar
source: contact.thumbnail
sourceSize.width: 60
sourceSize.height: 60
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
}
ListItemText {
id: nameText
text: contact.name.firstName + " " + contact.name.lastName
color: "white"
anchors.left: avatar.right
anchors.leftMargin: 10
font.family: "Helvetica"
anchors.verticalCenter: parent.verticalCenter
}
}
}
ListView {
id: listView
anchors.top: searchbox.bottom
anchors.right: parent.right
anchors.left: parent.left
anchors.bottom: toolBar.top
clip: true
model: contactModel
delegate: contactListDelegate
visible: true
}
SearchBox {
id: searchbox
anchors.top: statusBar.bottom
placeHolderText: "Search Contact"
onSearchTextChanged: {
searchingBusyIndicator.running = true
searchingBusyIndicator.visible = true
searchTimeoutTimer.restart()
}
}
Label {
id: noMatchesLabel
anchors.centerIn: listView
visible: false
text: "No matches"
}
BusyIndicator{
id: searchingBusyIndicator
anchors.centerIn: parent
platformInverted: window.platformInverted
width: 80
height: 80
visible: false
}
Timer{
id: searchTimeoutTimer
interval: 1000
onTriggered: {
searchingBusyIndicator.running = false
searchingBusyIndicator.visible = false
}
}
ToolBar {
id: toolBar
anchors.bottom: window.bottom
tools: ToolBarLayout {
id: toolBarLayout
ToolButton {
flat: true
iconSource: "toolbar-back"
onClicked: {
Qt.quit()
}
}
ToolButton {
flat: true
iconSource: "toolbar-search"
}
}
}
}
}
Now I need to change the visible property of the list view to false & the label property to true, when there is no matches in the list. How to achieve that.?
What's happening now is, the application crashes and terminates when there is no matches.

Answer 1

I spent 2 days while find solution of this problem...
here is my fix:
ContactModel {
...........
onRowsInserted: {
if(last === 0)
{
noMatchesLabel.visible = true;
listView.model = {};
}
else
{
noMatchesLabel.visible = false;
listView.model = contactModel;
}
}
While the contactModel haven't contacts because of using filters, we swap the model of listView to empty one. In that way the app doesn't crash