I'm working on building a filterable inventory list by pulling JSON data from our ERP system's API. My intention is to have multiple dropdown menus that can both be filtered by the previous dropdown and also filter the inventory list.
No styling yet, but this is the basic structure of what I'm doing.
Hoping there is a method I can use to allow for multiple "on" events using the amp-state component. Here's what I'm currently doing within a select menu:
on="change:AMP.setState({inventoryMachineType: inventory.items.filter(a => event.value == 'all' ? true : a.Type == event.value)});change:AMP.setState({oem: dropdown.items[0].type.filter(x => x.name == event.value)[0]})"
I have tried separating the two setState events with a comma, semi-colon, and breaking them out into two separate "on" events. I'm beginning to think this may not be possible within AMP but figured I'd ask if anyone has a solution.
If it turns out not to be possible I will just use a button to filter the data rather than having it filter in real time as the user changes the menus.
I'm an idiot. Was doing my comma separation wrong. Needs to be inside the curly brackets, not two separate sets of curly brackets (ie; change:AMP.setState({action1,action2}) <- correct vs. change:AMP.setState({action1},{action2}) <- incorrect).
on="change:AMP.setState({inventoryMachineType: inventory.items.filter(a => event.value == 'all' ? true : a.Type == event.value),oem: dropdown.items[0].type.filter(x => x.name == event.value)[0]})"