SelvaRaman
SelvaRaman

Reputation: 218

How to access the outer components from listitemcomponents in listview bb10 qml?

I am not able to access the Datasource id from inside of the ListItemComponent. Can anyone help me in regards to this?

ListItemComponent {
    type: "item"
    Container {
        id: listviewcontainer
        Container {
            preferredWidth: 768
            layout: StackLayout {
                orientation: LayoutOrientation.LeftToRight
            }
            CustomImageView {
                leftPadding: 10
                rightPadding: 10
                url: ListItemData.from_image
                horizontalAlignment: HorizontalAlignment.Left
                verticalAlignment: VerticalAlignment.Center
            }
            Container {
                preferredWidth: 538
                layout: StackLayout {
                    orientation: LayoutOrientation.TopToBottom
                }
                Container {
                    layout: StackLayout {
                        orientation: LayoutOrientation.LeftToRight
                    }
                    Label {
                        text: ListItemData.from
                        textStyle {
                            base: SystemDefaults.TextStyles.TitleText
                            color: Color.create("#2db6ff")
                        }
                    }
                    ImageView {
                        imageSource: "asset:///Home/img.png"
                        verticalAlignment: VerticalAlignment.Center
                    }
                }//Container
                Label {
                    text: ListItemData.message
                    multiline: true
                    textStyle {
                        base: SystemDefaults.TextStyles.SubtitleText
                    }
                    content {
                        flags: TextContentFlag.Emoticons
                    }
                }
                Label {
                    id: time
                    text: ListItemData.time
                    textStyle {
                        base: SystemDefaults.TextStyles.SmallText
                        color: Color.create("#666666")
                    }
                }
            }//Container
            ImageButton {
                id: delete_btn
                defaultImageSource: "asset:///Icon/delete.png"
                pressedImageSource: "asset:///Icon/delete.png"
                verticalAlignment: VerticalAlignment.Center
                horizontalAlignment: HorizontalAlignment.Right
                onClicked: {
                    deleteMessage(ListItemData.tid, ListItemData.uid);
                }
                function deleteMessage(tid, uid) {
                    var request = new XMLHttpRequest()
                    request.onreadystatechange = function() {
                        if (request.readyState == 4) {
                            var mResponse = request.responseText
                            mResponse = JSON.parse(mResponse)
                            var mResponseStatus = mResponse.response[0].receive.status;
                            var mMsg = mResponse.response[0].receive.message;
                            if (mResponseStatus == 1) {
                                msg_DataSource.source = "newurl.com" //   This line not works here..
                                msg_DataSource.load();              //   This line not works here..
                            } else if (mResponseStatus == 0) {
                            }
                        }
                    }// end function
                    request.open("GET", "myurl.com", true);
                    request.send();
                }// deleteMessage
            }//ImageButton
        }//Container
    }//Container
}//ListItemComponent

Here am not able to work out the following two lines

msg_DataSource.source = "newurl.com" 
msg_DataSource.load();  

I have tried like below but this also not working

listviewcontainer.ListItem.view.dataModel.message_DataSource.source = "myurl.com";
listviewcontainer.ListItem.view.dataModel.message_DataSource.load();

or this

listviewcontainer.ListItem.view.dataModel.source = "myurl.com"; 
listviewcontainer.ListItem.view.dataModel.load();

Upvotes: 3

Views: 1238

Answers (2)

Rian
Rian

Reputation: 93

Another simplest way to store the object to global variable using the following code which works fine with me.

         onCreationCompleted: {
         Qt.tabbedPane = tabbedPane;
         Qt.homeTab = homeTab;
        }   

Here I stored tabbedPane in global variable Qt.tabbedPane on page creation Completed.Now I able to access it from ListItemComponent using Qt.tabbedPane.

Hope it helps.

Upvotes: 1

nonesuchnick
nonesuchnick

Reputation: 627

The simplest way to make the data model accessible would be to declare a property alias to your data model wherever it is defined, for example in your ListView QML file. This would make your data model accessible to the top level component in QML from this property alias. In effect, it gives you a global reference to your data model from anywhere else in QML.

For example, if you data model is called msg_DataSource, then in the QML file where it is defined you can create the property alias like this:

property alias myDataModel: msg_DataSource

Then in your ListItemComponent deleteMessage function, you can use myDataModel like this:

myDataModel.source = "newurl.com" 
myDataModel.load();

Note: I am sure you could also do this in a more elegant way using signals and slots, but this way should be quicker and easier to understand.

Upvotes: 0

Related Questions