Adding label inside List record widget

Hi all,

I need to confirm if there is any way to add label widget inside list record widget?

To provide the gist of it, I have a screen which has List record widget and I am generating an input textboxes based on number of records in the list. E.g. If List has 2 records then two rows of input text box will be generated so that user can input list of records. However I want to link each input text box to label ( This is required since it doesn't pass through the compliance testing performed by ACheckers.).

Do we have any justification for this?

Really appreciate the help.

Thanks,

Sneha Sawant




Hi Sneha,

I don't have a justification for you. But indeed you can't put a label inside the List Records.

You will have to do some workaround. For example, to use web blocks for the input/pair, and have some extra logic to send the data back to the parent, to be saved, like using the OnChange with an Event or something else.

You can try to "simulate" the label. Use an Expression inside a container. The container OnClick you use to give the focus to the associated input, and the mandatory or not you can simulate also, with CSS and an IF that uses the IsMandatory of the Input.

None of the solutions is really good, but if you need a "label" (with the Label functionality), you need to do something like this, I think.

Cheers.

Hi Sneha.

You can workaround this limitation by using an unescaped expression with the label HTML code:

"<label for='" + YourInput.Id + "'>Your label text</label>"

Nice :)

Hi Sneha,

You are right. Indeed that (and other) widget nesting limitations do not make a lot of sense. The good news is those limitations have all been mostly removed in mobile and the new reactive web apps. For traditional web apps the workarounds Leonardo and Eduardo have mentioned are your only solutions for now. 

Cheers,

Tiago Simões

Thanks all for your reply.

I Genuinely don't need label functionality, However to pass the compliance test each input on my screen should be tagged to label however input widgets are generated dynamically. Hence I was trying to do workaround to add hidden label beside each input text box so that it will be tagged to specific label. However I also understand in Outsystem we cannot have Labels inside list so no luck. 

So as a workaround I have created  own HTML Tag as "label"' using "OSTAGNAME" and assign to  input using title property and it resolved my issue. Not sure if that is the best way.

However Leonardo's suggestion sounds more promising but when implemented it didn't fulfill my criteria.

Thanks again.

Sneha :)

Hi Sneha, 

Thanks for the tip to create the label!

Arthur

 

Another quickly way for workarouding this is using: https://reactjs.org/  or https://angular.io/docs