Oracle Cloud Technologies

 This is a continuation of previous blog . Now we must add logic to Cancel and Apply button and make sure the user changes are being recorded and pushed into BDP. Create a Boolean variable cancelEditVar and assign a default value as true to the same, this will later be user to record if the changes are to be discarded or pushed into BDP. For Cancel button create an ojAction event and assign cancelEditVar to true and editRow to { rowKey: null } Now for Apply button create an ojAction event and check to see if the form is valid and assign editRow to { rowKey: null } and assign cancelEditVar to false Now create an ojBeforeRowEditEnd event for the table, modify the cancelEdit property to pick value form cancelEditVar Create a new variable rowDataNew in ojBeforeRowEditEnd event and map the same to the variable rowData Create 2 functions areDifferent and mutateBDP to check if there is any difference between the old data and user edited data and the second function to actually mutate BDP ...

 This is a continuation of previous blog . Now add another blank column to the table where we will later add the edit row button to edit the respective row Create an ANY type of variable editRow and assign the same to edit-row property of the table Modify edit-mode to rowEdit Create an object rowData having same type as the Employee data to store user updates on ui Create rowTemplate inside the table as shown below to display rows in navigation and edit mode < template slot= "rowTemplate" data-oj-as= "row" >       < tr >         <!-- ko if: row.mode === "navigation" -->         < td >           < oj-bind-text value= "[[row.item.data.FirstName]]" ></ oj-bind-text >         </ td >         < td >           < oj-bind-text value= "[[row.item.data.LastName]]" ></ oj-bind-text > ...

  In this blog we will see how to create an editable Form Table using Buffer Data Provider (BDP). Create a basic VBCS Web app Create a basic Json file which will be used as Data Source to display data into table Create a function to convert JSON String file to an Array Create an ADP variable having the same datatype as the Json file Create an Action for vbEnter Event inside which assign the array value to the newly created ADP variable Now create a table in ui and assign the given ADP as data and include all columns in the table Include ‘ojs/ojbufferingdataprovider‘as BufferingDataProvider in JS file Now create below function in JS to wrap the ADP with a BufferingDataProvider (BDP) Create an Any type of variable and assign BDP value to the same Now assign this BDP to the table and run the application to see if the table is displaying data correctly

 In this blog we will create filter functionality for a table using ListDataProvider (LDP). Create an ADP based Table in VBCS based on any Data Source For this example, I will use a JSON file as Data Source and create an ADP based table for the same Create textboxes on top of columns which will act as filters for the columns Create 5 textboxes on top of each column to act as filters Create searchObject variable and map all filter text values to it Convert the ADP to ListDataProviderView Create function to convert ADP to ListDataProviderView Call custom function getListViewProvider , it takes a custom ADP and filter Criteria as parameters, on Page all data are shown hence filter criteria passed will be null Call on vb-Enter event and assign the same to oj-table data Assign a single value change event for all the filter fields Call custom function getFilterCriterion to get filter criteria for ListDataProviderView Filter the ListDataProviderView based on the filter criteria Run the Ui...

 In this blog we will see how to store table scroll position in VBCS and to return to the same scroll position Create a sample VBCS Application. Create a Table with ADP data source. Now create a variable of type any called scrollPosition and assign the same to Table property scroll-position. Now we will create another Page with a page parameter called scroll and navigate to the same on button click by passing the scrollPosition value to the same. In the new Page we will have a button called Return where we will pass the scroll value back to the scrollPosition. Now run the Application and see that when you navigate to another page and come back to the same page the scroll position is not refreshed to first row rather to the same view that was there initially. Reference : https://www.oracle.com/webfolder/technetwork/jet/jetCookbook.html?component=table&demo=scrollPosTable