Search code examples
google-app-maker

Filter a table based on selection on related table which is connected to a different datasource

My knowledge is at beginner-level on both App-Maker and software development, and I am trying to develop a little workflow automation and resource planning app on google app maker.

I have two tables (datasources): product and productColor. I store product info on "product" datasource and I want to store color variations in productColor. Therefore, there is a one-to-many relationship between product and productColor.

Here is my problem: I want to see all product entries and color variations in one page. I put a table widget which shows all products, and another table which is connected to productColor which shows all color variations of all products. What I am trying to achieve is when I click a record on the "products" table, I want "productColor" table to be filtered by product ID which I have clicked. Note that those tables use different datasources.

Thanks for any help.

Solution

  • Two options:

    Set the datasource for your productColor table to 

    product: productColor (relation)

    and in your product datasource set the prefetch to productColor. This automatically fetches the related colors for the selected product.

    Or

    In your productColor datasource uncheck 'automatically load data'. Then in your product onLoad/onItemChange event (client script) enter the following code:

    var ds = app.datasources.productColor;
ds.query.filters.product.Product_Id._equals = datasource.item.Product_Id;
ds.load();