How to get data from child webblock?

How to get data from child webblock?

  

Hi, I have a web screen as per attached prototype and the screen is for user to answer the list of questions. The quesiton template has list of sections and each section has list of quesitons. 

So I need to have web block for list of questions to cater for nested list. 

But when user clicks on save button, I am having issue with getting data from web block in order to save the users' answer to the database. Is there anyway I can get the data from webblock from the parent screen?

Appreciate if someone can help. 


Hi Aung,

You can use the Message parameter in the Notify action in the child to send data from the child to the parent which uses the NotifyGetMessage action.

 


Regards,

Furkan

Hi Furkan, thanks for your reply. But Notify event is triggered only when user do something on webblock. In my case, I need to get data in webblock from parent screen when user clicks save button on parent screen. There is no action triggered at webblock and how can I pass notify message to parent screen?

In your case you want the user to select an answer am I right?

Furkan Çetin wrote:

In your case you want the user to select an answer am I right?


Yes user needs to select answers and he also need to enter remark in input box.

You would need to save the answers as they are clicked via the mechanism that Furkan suggests to a temporary storage place structure/list/db and then when the user click Save process the structure/list/db to save the answers to the underlying database. I have done this exact thing with a dynamic list of questions and answers, previously.

There is a solution I have in my head, I will explain you. You can make a list of the Entity where you save the given answers in the parent. Still use Notify in the child webblock and the NotifyGetMessage in the parent. You can Notify OnChange in the child webblock and in the parent after the NotifyGetMessage you can create a object from the Entity (called above). After this add the object to the list in the parent and when you click on Save in the parent you can loop through the list to save all the objects in the DB

Hi All,

What you want to do is call an event inside the web block. Inside a mobile application, this is already quite simple but inside web applications, you will need a little help from the Forge component: Event System.

This Forge component you can trigger events from the parent (page) to the child (web block). So, for instance, you press a button on the page and that will trigger a screen action on the web block.

Hope this helps!

Kind regards,
Martijn Habraken

Hi all,

Thank you all for your advice. 

@Furken, with your suggestion, i have performance concern because it will trigger NotifyWidget when user types something on Remark input (Textbox). 

@Martijn, I have tried Event System component and I am getting error from their license page. It seems there is license required to use it. I have posted the issue on their forum and no reply so far. So I think, it is not good choice.

I  have implemented a javascript function (to extract data and return as json) inside child webblock and parent screen will invoke that javascript function upon clicking save button. It works for me. 

Best regards,

Aung

Hi Aung,

I have an idea for you. Just follow the steps.

1. Add a hidden field in your web screen.

2. Add a local variable in web screen

3. Map the hidden to this variable

Now we need to set value to the hidden to get it in server side through the local variable.

Next steps -

1. Add class attribute to section to identify sections in your page using java script(same class name for each section)

2. Add class attribute to question and remarks.

3. Using JavaScript function(can use jquery) you can get the list of sections by class name.

4. Loop through each section and find the question and remarks again by class name.

5. Now try to make a JSON string using the data that you get while looping through the sections.

Like -  [{section:sectionA, ans:a1, remk:r1},{section:sectionA, ans:a2, remk:r2},{section:sectionB, ans:a3, remk:r3}]

This JSON string will be available in local variable of that screen as it is assigned to hidden field.

Now button click and in your screen action you need to parse the JSON and can be saved by server action.

Wit OS11 you can have event handlers and events with strong typed parameters, which I think is a huge improvement over the Notify and NotifyGetMessage server actions.

@sourav pasari This is definitely not the Low code way to do this! 

Avoid using Javascript! or create a component to make it reusable.

This is easily done by creating: 

  • create a local varialbe with a structure holding all the input fields of this webblock
  • create a action that is triggered on every onchange of a input field
  • in this action JSONSerialize the data and Notify it

In the screen where the webblock is places; you create a OnNotify Action with a NotifyGetMessage; JSONDeserialize this message and; there you have the data of the webblock; store this data in a local var of the parent screen

in the parent screen you can save the data that is received by a normal button action. 

Or upgrade to OS11; in this version it is even more low-code....


The OutSystems 11 way; The Onchange of input-fields is set to the OnChangeData trigger; that will call a action (with input parameter) on the parent-screen.

So there's no JSON serialize / deserialize and message notify and get anymore, only actions and in/output parameters; The OutSystems Low-code is getting better and better!

(this was already possible on the Mobile version of OS; but it is now also available on Web too)