289
Views
8
Comments
Solved
How to validate input widget created at runtime
Service Studio Version
11.53.20 (Build 61431)

Hello,

is it possible to validate a widget created at runtime in Reactive Web?

For example, i have a "List widget" with an aggregate as source.
Every time i refresh this aggregate the "Input widgets" inside the "List widget" increase or decrease, but when i try to set to false/true the "valid" property inside a screen action, i cannot find these inputs.

Any advice?

Thanks,
Matias


2023-10-21 19-42-11
Tousif Khan
Champion
Solution

Hello

So you have a List and on that list you have Inputs that are dynamically created

This question was asked multiple times and to perform validation inside a Table or List widget having dynamic inputs, you need to do a work around to show message and you need to also play with css for the use case.
You can either take a expression below the input field and upon validating it you can show/hide it.

There are some post created for this with some good suggestions you can have a look they might be helpfull.

You can also check this Forge Component available that might help you in this

I hope this will help you

Best Regards,
Tousif Khan

2022-10-11 21-19-04
Fábio Miguel Ferreira Coelho

Hello Matias,


I hope you're doing well.


You can't find these inputs because you are using a List widget and you don't have access to the Valid and ValidationMessage property if you use a List Widget, but if you use a Form Widget you have access to the Valid and ValidationMessage property.


Let me know if this sounds good to you and fits what you need.

If you have more questions or doubts don't hesitate.


Kind regards,

FC

2023-10-21 19-42-11
Tousif Khan
Champion
Solution

Hello

So you have a List and on that list you have Inputs that are dynamically created

This question was asked multiple times and to perform validation inside a Table or List widget having dynamic inputs, you need to do a work around to show message and you need to also play with css for the use case.
You can either take a expression below the input field and upon validating it you can show/hide it.

There are some post created for this with some good suggestions you can have a look they might be helpfull.

You can also check this Forge Component available that might help you in this

I hope this will help you

Best Regards,
Tousif Khan

2021-09-06 15-09-53
Dorine Boudry
 
MVP

Hi @Matias Recondo ,

you can't directly address in your low code action flow the valid property and validation message of the widgets that are inside a list.

One of the solutions is putting your inputs inside a webblock, giving you access to the valid properties within the scope of that block, but that gets messy with having to signal all changes with events up to the parent form. 

Outsystems offers a javascript API to invalidate a widget, so the thing you need to solve is the link between a variable in your list that you find some fault with, and the corresponding html element.  One of the ways is to give the elements a distinguishing property that involves the rownumber, and use that same distinguishing property to invalidate them with the Validation api.

See attached oml.

Dorine

QDR_ListValidation.oml
2022-05-11 07-43-11
Matias Recondo

Thanks you all and sorry for the late reply.

Yes the list is inside a Form Widget and the Inputs were dynamically created, so I couldn't select them directly.

As suggested by Tousif Khan, I've used the ListValidation plugin and it works smoothly,

thanks!

P.S. just a question, ListValidation plugins can works with Dropdown, Textarea and Upload Widgets?

Matias

2023-10-21 19-42-11
Tousif Khan
Champion

Your Welcome :)

I am glad that I was able to help

If you find this helpful please mark it as a solution so if anyone else came up with the same issue, they can easily find it.

Thanks
Tousif 

2022-05-11 07-43-11
Matias Recondo


Done it :)

Do you know if ListValidation works also with Dropdown, Textarea and Upload Widgets?

Thanks

2023-10-21 19-42-11
Tousif Khan
Champion

I haven't tried it, will do some research on it and let you know

2022-05-11 07-43-11
Matias Recondo


I solved it by modifying the javascript inside the action "InputListValidator" and adding the cases for the dropdown, textarea and upload.
Of course I created a new custom action for my use case.

If anyone need it:

var element;

if ($parameters.WidgetType === "Input") { 
element = document.querySelector('input[inputname=inputName-' + $parameters.Index +']'); 
}

if ($parameters.WidgetType === "Dropdown") { 
element = document.querySelector('.dropdown-container[selectName=selectName-' + $parameters.Index +']'); 
}

if ($parameters.WidgetType === "Textarea") { 
element = document.querySelector('textarea[textareaName=textareaName-' + $parameters.Index +']'); 
}

if ($parameters.WidgetType === "Upload") { 
element = document.querySelector('input[inputFileName=inputFileName-' + $parameters.Index +']'); 
}

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.