Hi there, I have forked Observable’s awesome template for Survey Cross-Tabulation and am trying to add additional filters to the survey data before it gets processed and then used by the cross-tabulation functionality.
Here’s a link to a notebook that serves as an example for what I’m trying to avoid, which is that the selected questions reset to their default indices each time the data is filtered.
Any solutions I’ve tried result in circular references. I appreciate any suggestions folks may have.
You can “back-write” into a view using viewof <identifier>.value = <value>, you can trigger its downstream cells to be notified of the change with viewof <identifier>.dispatchEvent(new Event('input', {bubbles: true})). The advantage of backwriting is that it forms a dataflow dependancy with the viewof identifier and NOT <identifier>, so it can be used to avoid circular references.
This means you can update the answers in the radio buttons by backwriting into them. This idea can actually be generalised a little bit, which leads to Squeezing more Juice out of UI libraries / Tom Larkworthy / Observable where you can transform ANY params of a view builder into a back-writable reactive component.
So typically, Inputs.radio() does not support dynamic options, you can;t back-write into to change the options, but with juice you can.
So you can have a little logic cell downstream of everything, writing back into its ancestors with viewof <ansestor>.value reactivity on any change in your UI state.
here is an example of using a downstream logic block to manipulate an upstream dynamically changing set of radio options with juice and back-writing Community Help / Tom Larkworthy / Observable
A simple technique is with this, which either is undefined (when the cell is created) or refers to the previous contents of the cell, and set the value of the new cell accordingly:
Thank you very much, Tom, for these great suggestions and resources. Because the question “compare question selector” component in the survey template is somewhat complex for me, I couldn’t figure out how to apply juice to it, but I do need juice for a different situation where I do need to “back-write” into an Observable Input, so I’m grateful that you shared the example and the documentation. So, thank you, and cheers!
