How do I make an image visible/not visible for each record in a list based on a second collection?

[Gabriel Bizcarra]

Hi,

I'm trying to make an image visible or not visible based on a)an event collection and b)an attendance collection that holds the eventID and the UserID.

I have two services, a query service called EventQuery for the colEvents collection and a query service called AttendQuery for the colAttendingEvent collection.

EventQuery Service:
In EventQuery service I assign the EventID to the a localstored variable. In the JavaScript for that mapping I execute the AttendQuery service.

alert("PreExecute");
AttendQuery.execute({});
alert("Executed");

AttendQuery Service:
In the AttendQuery service i have a where clause passing both the EventID and UserID from the localstored variables.

I mapped the response EventID to the image visible property and inserted the javascript below to change the visibility:

var vEventID = localStorage.getItem("EventID");

alert(vEventID);

if (vEventID==null || vEventID=="")
return false;
else
return true;

You'll notice I have alerts in all the javascripts. What I hoped was that the AttendQuery.execute({}); would run for each row as they are presented in the list, instead all the rows are shown first (I see the "PreExecute" and "Execute" alert for each event row) followed by the each AttendQuery alert (in this scenario I see "[EventID]", "[null").

As a consequence all the rows have the image non-visible.

Is there a way I can make the AttendQuery execute for each row or should I be doing this differently?

I have attached screen shots.

You're help is greatly appreciated.

Regards,

Gabriel.

[Oleg Danchenkov]

Hi, Gabriel.
Instead of your code:
precodevar vEventID = localStorage.getItem("EventID");
alert(vEventID);
if (vEventID==null || vEventID=="")
return false;
else
return true;
/code/pre
Try this:
precodealert(value);
if (!value) {
return false;
}
return true; /code/pre

[Gabriel Bizcarra]

Thanks Oleg.

We might be getting close. I can see that the image is becoming visible for each row but I'm not sure the condition is being met. The alert comes back "undefined".

[Oleg Danchenkov]

"undefined" in alert means you have an empty value in corresponding column.
Could you please clarify.
As I understand from your screenshots you have 2 services: dbEvents_colEvents_query_service and dbEvents_colAttendingEvent_query_service.
You get all information (it might be few rows) from dbEvents_colEvents_query_service and dbEvents_colAttendingEvent_query_service just makes one image in each dataset visible/unvisible.
Is it correct?

[Gabriel Bizcarra]

hmm.. actually just tested it again.. I looks like the condition test is working fine, it's the visible bit that isn't working as expected. When it changes visible to false or true, it seems to apply it to all records in the list not just the line I'm interested in. I'm a little confused

[Gabriel Bizcarra]

Correct I'm expecting an empty value. If it's an empty value the image should not be visible, when I get a value, it should be visible.

[Kateryna Grynko]

Hi Gabriel,

You should do this another way.

Your requests go asynchronously. One fills data, another must find an appropriate item in this data and make it visible or invisible. Mapping does not do such a search so you can't just do mapping for service dbEvents_colAttendingEvent_query_service.

You would need to use JS to search for a needed image on page, or you would need to change the database structure so that you can do such a request to the database to get all the data in one service. Then you can map data on the page and set image visibility.

Please see http://docs.appery.io/documentation/b...

[Gabriel Bizcarra]

I'm still not having any joy with this but I believe it has to do with WHEN the AttendQuery.execute({}); runs.

Rather than map the EventID to the localStored variable I set it using the value within the javascript in the MainPage. Here is the javascript.

localStorage.setItem("EventID",value);
alert("1:" + value);

localStorage.setItem("varVis",false);
alert("2:PreExecute");

AttendQuery.execute({}); //This is not executing until all the rows from the current service are shown
alert("3:Executed");

var vVis = localStorage.getItem("varVis");
alert("4:" + vVis);

return vVis;

The javascript in the AttendQuery just

alert("a");
localStorage.setItem("varVis",true);

because if there are no records, it just should not run the javascript.

You'll notice I've numbered the alerts from the main page and have the letter "a" for the AttendQuery. The results I would expect would show alerts in this order:
1,2,a,3,4 - when there is a record and 1,2,3,4 when there is no record.

The actual result is alerts 1,2,3,4,a.

Conclusion: the AttendQuery.execute is NOT running until all the records from the original EventQuery service are completed.

Is this a bug? Or should i be using a different method to query the values in the second collection?

[Gabriel Bizcarra]

Apologies I just saw this response, I'll try and confirm

[Gabriel Bizcarra]

Having all the data in one collection won't work because one collection is showing events and the other is a list of users who have said they would attend this event. It's not possible nor practical to combine these collections.

Using include would limit the record to only those that are in both collections. This means the user would not be able to see any events they are not attending. Again this doesn't work.

I need to be able do the same as an OUTER JOIN type function in SQL or be able to query the second collection from within the first service. Please see the post below for more details. I think there's a bug with the execute, it doesn't run when the javascript asks it to.