43
Views
6
Comments
Solved
How to turn your javascript code into component or widget

I have a custom javascript code in outsystems that builds an editable grid like ag-grid but as of now we have to call the javascript function from client action. I want to make a widget out of that in outsystems where I can pass neccessary parameters and the same task will be performed just like table widget. Can anyone help me in this?
Please let me know if you are not clear with the question.

Thanks and Regards,

Ayush Bajaj

Rank: #388
Solution

Hi,

Create a seperate application. Include the required js files in the application. Now suppose you want to create main ag-grid, then add an blank webblock where you can send input parameters those are required for your js. In the web block loading time may be in preparation, try to render the script required and use your parameters in js. Now you can drag this webblock to another application and use it.

I had a same requirement for ag-grid. We did that in same way. We created different different web blocks for different type of columns. This is same like your requirement. I will share some screenshots for the process we followed.

Thanks

Sourav

Hi Yash,

I highly recommend you to watch a talk presented on this year's next step named "Creating Quality Reusable JavaScript Forge Components".

Unfortunately I cannot share the direct URL but you can login in the web site and search the name I posted in the agenda tab.

The talk it self covers everything you should account for while building reusable JS components.

Rank: #388
Solution

Hi,

Create a seperate application. Include the required js files in the application. Now suppose you want to create main ag-grid, then add an blank webblock where you can send input parameters those are required for your js. In the web block loading time may be in preparation, try to render the script required and use your parameters in js. Now you can drag this webblock to another application and use it.

I had a same requirement for ag-grid. We did that in same way. We created different different web blocks for different type of columns. This is same like your requirement. I will share some screenshots for the process we followed.

Thanks

Sourav

Rank: #388

Hi,

I got some time to reply. I didn't get so much time after office work. I have created a sample AG-Grid component and a Test application. I am attaching the application along with a document. 

This is with very small options but you will get an idea how I did it.

Hope that helps you. If any doubt please let me know.

AGGridImplementationinOS.docx

Rank: #388

Hi,

This is the OAP file.

AGGrid.oap