Advice for complicated collection list form component

I’m creating a form that a patient would fill out. But this form is inherently variable, because the form questions are defined by an administrator (SaaS tool). The administrator can create as many questions as they want per form, and they for each question they can choose one of 5 answer types: number, text, bool, date, scale. Each question can also be assigned to a question_category.

So in the patients experience I select a form, then:

  1. Group the questions by category
  2. Present the category title, then the group question
  3. For each question, I have a input component for each of the 5 potential answer types, but hide all the ones that aren’t relevant for the particular question.

So in my UI, I have a collection list (the questions), embedded in a collection list (the categories), embedded in a form (just because the form was the easiest way to implement “required” questions… but is also potentially the problem).

Anyways - the visuals work fine:

The problem comes when I want to submit the data :slight_smile:

I tried first using the approach @dorilama suggested in Are form variables not visible while the form is in a collection item? - #6 by dorilama, but I didn’t have access to the input components. So basically the individual component doesn’t have access to it’s own value… or at least not in the low code editor

SO I turned to JS, and gave each input value a unique HTML Id “answer-type-question#”, so as an example, the number answer field for question with id 8 would be “answer-number-8”. In order to create unique Id’s, even the field inputs for questions that are hidden still have unique Ids, they just are mostly irrelevant. But that works - each answer field shown to a user has a unique Id.

This is where it gets double weird, and I’m SO CLOSE to making this work:

I can bind a text value on the page to the htmlId

but when I type the exact same code into a workflow step, it gets a type error:

This basically means I can’t correctly get access to the input values in a workflow, which is necessary to submit the form

That all said, there is a side issue: I can only actually access the input component value for the number and text type components. I can’t get the scale, date, or bool values… also significant, but I haven’t even tried debugging that yet because doesn’t matter if I can’t get the above to work.

And yes, I probably should just write this whole component in custom code… but alas working with what I got. If you’re open to coding that for me for $ let me know

Ok wait I might have been dumb - I was looking for the variable in the variables tab, but it looks like it is available in the “On Click” event - that wasn’t intuitive to me. Giving that a shot

I spent so long looking tat the variables… answer was right in my face… the event.value is working fine…

Wish I could delete this post now :slight_smile:

1 Like

Haha I actually love these posts because we’ve all been there :smile:

  • it’s great user feedback for our product team!