Yan Yi
Posts: 0
Joined: Sat Jan 25, 2014 7:38 pm

Mapping list items with grids

Hello! This question is about mapping of list items which contain grids (see image).

Description of list information:
I have a database of different users. Each user can store contact information for friends (phone number, name, picture). I wish to display all the contacts in a list, with the phone number, name and picture in each list item.

Mapping list when there is only one component, like name, is easy. Just have to map the response to the label and the $ sign to the list to get a looping feature. However, how do I map when there is more than one component in a list?

What I tried:
I created two list services. One list service is for name and phone number mapping. The second list service is for photo mapping (stored in a different collection). Name and phone number mapped to the labels and photo mapped to the picture component. This worked ok for one contact.

To get a looping feature for more contacts, I mapped the $ sign from the first list service to the list item and the $ sign from the picture list service to the picture list item. However, the list did not appear when tested. What am I doing wrong here?

Image

Igor
Posts: 0
Joined: Tue Apr 02, 2013 12:05 pm

Mapping list items with grids

Hello,

Could you show screenshot with service mapping?

Yan Yi
Posts: 0
Joined: Sat Jan 25, 2014 7:38 pm

Mapping list items with grids

I have blurred out some parts for privacy.

Image Image

Igor
Posts: 0
Joined: Tue Apr 02, 2013 12:05 pm

Mapping list items with grids

You have two services and only one list component which could work with ONLY ONE service.

To build what you want, you should combine two services into one.

You should:

Get all users(first service) and extend them by photo(other service). You get one object(users with photo) after these manipulations.

For this purpose you can use:

1 Server code(more preferably). Read more about it here: http://docs.appery.io/documentation/b...

2 Generic Security Context. Read more about it here: http://docs.appery.io/documentation/g...

You'll get third service after. This service can be easily mapped to your list.

Yan Yi
Posts: 0
Joined: Sat Jan 25, 2014 7:38 pm

Mapping list items with grids

Thank you Igor. I have simplified my app to use only one service. Now, the photo and other information of the contact is in the same collection. With this, I can successfully generate a list of all the user's contacts from the collection!

I've got a second question. When I click on one of the generated list items, it will bring me to a page showing ONLY that contact's phone number/name, and I can change it by invoking the updateService. How do I ensure that the correct objectID of the contact which is clicked is inserted into updateService (to update) and readService (to display phone/name)? There might be a different contact clicked by the user every time.

Sample database structure:
Image

Kateryna Grynko
Posts: 0
Joined: Thu Nov 15, 2012 9:13 am

Mapping list items with grids

Hi Yan,

You can map a record id to a hidden label. Then add a Grid Click event handler and read this label value, for example:
prevar id = $(this).parent().find("[name=labelName]").text();/preWhere 'labelName' is a hidden label name.

Yan Yi
Posts: 0
Joined: Sat Jan 25, 2014 7:38 pm

Mapping list items with grids

Thank you Katya. Got it to work. However, there's a slight mistake in the code. It should be codevar id = $(this).find("[name=labelName]").text();/code

Using .parent() gives ALL the _ids in the list, not just the one I clicked.

Kateryna Grynko
Posts: 0
Joined: Thu Nov 15, 2012 9:13 am

Mapping list items with grids

Hi Yan,

Sorry for the misunderstanding. Let us know if you have any further questions.

Return to “Issues”