The Visual Builder Cloud Service Blog

Editable Tables in Visual Builder - The Oracle JET 6 Way

Shay Shmeltzer
Director of Product Management - Oracle

[Update March 2020 - we have a new pattern recommended for creating editable tables - please refer to this approach instead of the one shown in this entry]

A while back I blogged a solution to creating editable tables in Oracle Visual Builder, that was based on the approach that was used in the Oracle JET 5 cookbook - using a row template that you switch to show an editable version of each row.

Now that Visual Builder 18.4.5 got released, we support using Oracle JET 6 in your application, and this provides a simpler way to create these type of editable tables with a column template. In the video below I show you how to leverage this approach, which also results in elimination of coding any JavaScript code.

As you'll see you simply drag new UI components onto the column in the table that you want to edit. Then you make sure they point to the right values, and that they allow you to edit the value in them. Then when your table is in editMode you can simply edit the data using different types of input UI components.

In the demo I also show how to add a save button that will save the data into your backend. As I mention in the video, the save approach I use is not the most efficient one. You would get better performance if you'll only save records you changed, and if you'll leverage the ability of the business objects in Visual Builder to execute multiple transactions in one go.

In any case - this demo should get you started on your way to having editable tables:

If you need more info on how to create the type and variables shown at the beginning of the video - check my previous blog entry on editable tables.



Join the discussion

Comments ( 3 )
Please enter your name.Please provide a valid email address.Please enter a comment.CAPTCHA challenge response provided was incorrect. Please try again.