CODEWITHSUNDEEP
google-app-maker
Sledge
Sledge

Reputation: 1345

GSuite Appmaker - how to set default value in table using button

I am trying to put together a mock up for a data collection app for a local nonprofit using GSuite's AppMaker. So far I really like the tool.

One thing I need to be able to do is streamline the data entry for the site representatives. In my app, I display a list of students in a table, where one of the columns is a boolean value which represents attendance. The desired result is for the teachers to be able to input the date field one time using the date input button at the bottom of the page. Then they can quickly point and click down the Present column to log attendance.

My question is: how would I link the date selector dropdown so that the date field pre-populates with the selected date from the input field? I don't want them to have to enter the field over an over again since its the same for each row and I don't want the user experience to feel clunky.

Screenshot of the App for reference: Screenshot of Attendance Input

Upvotes: 0

Views: 54

Answers (1)

Morfinismo
Morfinismo

Reputation: 5253

Using client script, you can add the following to the onValueEdit event handler of the date widget at the bottom. 

var items = widget.root.descendants.<YourTable>.datasource.items;
items.forEach(function(item){
    item.<DateField> = newValue;
});

The only thing to take into account is that when using client scripting, you will only update the records loaded in the table at the moment; i.e, if your table has paging, it will only update the current page. If you are using paging, then you will need to add the following code to the onPreviousClick and the onNextClick event handlers of the pager widget:

var selectedDate = widget.root.descendants.<YourDatePicker>.value;
var items = widget.root.descendants.<YourTable>.datasource.items;
items.forEach(function(item){
    item.<DateField> = selectedDate;
});

Upvotes: 1

Related Questions