Dynamically add form sections?
Is there a way to add a styled form section dynamically? I have looked at the workflow samples for adding form elements, and the example doesn't include the Section type. When I tried to follow the same pattern, nothing shows.
Based on the workflow example, I see that you can set the added element to a section, but can that section be dynamically styled, configured or does it need to have been pre-created?
Example Element property that creates a section called section1, but I haven't figured out how to make it a grouped or collapsible section if possible?
{
"title": {
"markdown": `${$forEachDynamicReport.item.title}`
},
"description": {
"markdown": `${$forEachDynamicReport.item.description}`
},
"section": {
"name": "section1"
}
}
--Marc
-
Hi Marc,
You should be able to add a section using the "Add Form Element" activity with the following inputs:
Element ID: exampleSection
Type: Section
Element:
= { "format": "fieldset-section" }The format can be "fieldset-section", "basic-section" or "collapsible-section". You can also omit this property to have an unstyled section.
Any form elements you add after this one are automatically treated as being "in" that section. Adding another Section element will end the previous section and start a new one.
I hope this helps!
0 -
Hi Ken,
Thank you for the helpful response. Is there any documentation on the possible Element properties? When I try to add known properties of a particular element the inline validator keeps throwing warnings. So far I am aware of
{
"title": {
"markdown": `${$something}`
},
"description": {
"markdown": `${$something}`
},
"section": "someExistingSection",
"format": "collapsible-section"
}
Are there others we can use?
Related, I am trying to dynamically set an image in a form and have been able to use the value property to set the url source, but can't figure out how to do the size (height or width). Any tips?
--Marc
0 -
@Ken Lyon?
I tried adding the format property to the element on the Add Form Element activity that is inside of a load event on the form title and I am still not getting it to render the sections in the sandbox. I have it adding a test text element after each section addition and I see those text elements, but they are not in sections.
Any chance you have a simple example I could look at to see what I am doing wrong?
Thanks,
Marc
0 -
Hi Marc,
We don't have detailed documentation for all of the properties that you can use with Add Form Element. The best I can suggest is to create a new workflow with a form element configured as you like it and then export the workflow to a .json file. You will be able to see the properties for the element in there. I realize this isn't the most ideal approach, but it is a workaround at least.
By the way, the "section" property should not be set. It is added at runtime to keep track of which section an element is inside. In your example, it looks like you're saying your section element is inside itself.
As for the image element, you can do something like this. (Which I found using my own trick above)
= { "size": { "height": 200, "width": 400 }, "tooltip": "Miaow", "type": "Image", "value": "http://placekitten.com/400/200" }0 -
@Ken Lyon?
That is a good tip about looking at the output json of the workflow to see properties for form elements.
However, even when doing that I am still not able to get a section to actually generate using the Add Form Element activity.
This is what I am trying. New workfow. Add a form. In the load header event, I have the Add Form Element with the following inputs:
Element ID: ="exampleSection"
Type: Section
Element: ={
"collapsed": true,
"description": {
"markdown": "Section Description"
},
"enabled": true,
"format": "collapsible-section",
"title": {
"markdown": "Section Title"
}
}
I then add another text form element with the Add Form Element activity with
Element ID: ="exampleSectionText"
Type: Text
Element: ={
"title": {
"markdown": `Test!`
},
"description": {
"markdown": `Text description`
}
}
When I run the sandbox, I just see Test! and Text description, but not in a collapsible section.
-- Marc
0 -
Hi Marc,
Just by chance I got the same question today from someone in our services team. I believe this doesn't yet work for sections. They're a bit more complicated than regular form elements due to the fact that they nest others.
We might be able to address this in future, but in the meantime the only workaround I can really suggest is to try adding a section with visible: false and then move things into it later. Hopefully this will work.
0 -
Hi Ken,
Okay, thanks for verifying. At least I know I am not missing something obvious. I ended up adding a bunch of sections to the form and then add content to them dynamically. If no content is added to a section it won't show up even if it is set to visible if it has no sub elements it seems. Not the most elegant, but works for now.
The image resizing worked well and the tip to look at the workflow json for properties will come in handy.
Thanks,
--Marc
0
Du måste logga in om du vill lämna en kommentar.
Kommentarer
7 kommentarer