How to set current item in App Maker datasource? - google-app-maker

Question

This seems basic but I can't seem to figure out how to manually set the current item to work with from the datasource?
To illustrate: I have a table and I notice that when I select a row to edit a field, the item of that row becomes the current item, so if I have a link on that row to Navigate to a page, the row of the item selected will be the datasource.item for the navigated page.
However, I also notice that if I just hover over a row, without selecting to edit a field, if then I click on a link to Navigate to a page, it loads the data of whatever row was previously selected/edited. Therefore I'm wondering how to make it so that just on a mouse:over (or click on the shortcut without a prior click on another field in the row) the datasource.item will update to the the row the mouse has gone over instead of requiring to edit a field on the row first. I hope that makes sense.
Assistance is much appreciated. Thank you!

Answer 1

Why it happens:
AM code: generate button click event
User code: handle button's click event
User code: navigate user to different page
AM code: destroy DOM of current page
AM code: build DOM for new page
-- dead code after this line
AM code: row click event handler
AM code: change datasource's current item
Row's click event handler never gets control, because row is destroyed by user's code.
What Morfinismo's solution does?
AM code: generate button click event
User code: handle button's click event
AM code: row click event handler
AM code: change datasource's current item
-- moved lines
User code: navigate user to different page
AM code: destroy DOM of current page
AM code: build DOM for new page
Here are more tech details: Event Loop
In App Maker this problem can be solved with
setTimeout
Force current item update in user code
// button's onClick event handler
app.datasource.ListDatasource.selectKey(widget.datasource.item._key);
CustomProperties
// button's onClick event handler
app.pages.ShowMeNext.properties.Key = widget.datasource.item._key;
app.showPage(app.pages.ShowMeNext);
// next page's onAttach event handler
app.datasources.RecordDatasource.filters._key._equals = app.currentPage.properties.Key;
app.datasources.RecordDatasource.load();
URL parameters and history - this approach is used in most template apps, because it also implements deep linking on some extent.
// button's onClick event handler
var params = {
key: widget.datasource.item._key
};
var page = app.pages.ShowMeNext;
app.showPage(page);
google.script.history.replace(null, params, page.name);
// next page's onAttach event handler
google.script.url.getLocation(function(location) {
app.datasources.RecordDatasource.filters._key._equals = location.parameters.key;
});
Passing value between pages using global scope
// button's onClick event handler
window.key = widget.datasource.item._key;
// next page's onAttach event handler
app.datasources.RecordDatasource.filters._key._equals = window.key;
ListDatasource - list/grid/table datasource
RecordDatasource - datasource dedicated for a specific record (single-record datasource)

Answer 2

Use a timeout function. This happens because it takes some time for appmaker to change the item in the datasource. You can use something like this on the onClick event handler of the button or link that will take you to the other page:
setTimeout(function(){
app.showPage(app.pages.pageToNavigate);
},200);
That should take care of the issue. I hope this helps!