Visual Builder

Get Involved. Join the Conversation.

Posts

  • Nagambika Anguraj
    How to implement pagination for <oj-table> which uses...2
    Topic posted Yesterday by Nagambika Anguraj, tagged Custom Code, JET, Style, UI, Web 
    Title:
    How to implement pagination for <oj-table> which uses Service Data Provider(SDP).
    Summary:
    How to implement pagination inside the <oj-table> and <oj-paging-control> using Service Data Provider(SDP) instead of Array Data Provider(ADP).
    Content:

    Used <oj-paging-control> within <oj-table> tag.

    The <oj-table> renders results from Service Data Provider.

    But as per mentioned in the JET Cookbook, the <oj-table> as well as the <oj-paging-control>  uses the Array Data Provider.

    In our application we use the following table with SDP:

    <oj-table id="oj-table-lov" class="oj-flex-item" data="[[$page.variables.listOfValuesBOListSDP]]" >    
        <oj-paging-control id="paging" data="[[$page.variables.listOfValuesBOListSDP]]" page-size="10" slot="bottom">
        </oj-paging-control>
      </oj-table>

    The usage of the above OJET code within the application gives the following error in the console:

    Uncaught (in promise) Error: oj-paging-control with id 'paging': Error while rendering component. TypeError: data.getPage is not a function
        at Object.throwError (ojcorebundle.js:6683)
        at createComponentCallback (ojcorebundle.js:6555)

    Please let me know how to implement Pagination using Service Data Provider(SDP)  instead of Array Data Provider(ADP).

    Version:
    1.0
    Code Snippet:
  • Preetesh Dongre
    Screen flickering issue2
    Topic posted Yesterday by Preetesh DongreBlue Ribbon: 750+ Points, tagged Action Flows, JET, Style, UI, Web 
    Title:
    Screen flickering issue
    Summary:
    Screen flickers after an event
    Content:

    Hello Experts,

    I have a table(based on ADP) which has events associated with columns values and in the event I am doing some computation, setting enable/disable property for other columns and then assigning the values back to ADP so as to reflect changes on the UI.

    Everything works fine except one issue, every time event happens table flickers to show the updated table, it's annoying for the users as I have event on almost all the columns.

    Is there a way I can avoid screen flickers?

    Regards,

    Preetesh

  • Rahul L
    Capture values in comma separated, selected from Select...1
    Topic posted December 5, 2019 by Rahul LGreen Ribbon: 100+ Points, tagged Composite Component, Custom Code, Database, JET, Layout, Style, UI, Validation 
    Title:
    Capture values in comma separated, selected from Select Many Component
    Content:
    Hi, I am using a Select Many Component to select multiple values from LOV listed from Rest. Now i wanted to store the selected values in custom table with comma separated values. Can someone please help me with this. Thanks Rahul
  • Stiven Oliveira Bezerra
    Action Take Picture
    Topic posted December 2, 2019 by Stiven Oliveira BezerraBlue Ribbon: 750+ Points, tagged Action Flows, Mobile, Style, UI 
    Title:
    Action Take Picture
    Content:

    Hi, 

    I'm using the Action to Take a Photo, but when i use the mobile, i just want take a photo with camera, i don't want browse on gallery the photo. Its possible deactivate the browse on gallery photo?

     

    Thanks

  • Nagesh Manda
    VBCS Application for a Jewellery retailer
    Topic posted December 2, 2019 by Nagesh MandaGold Medal: 3,500+ Points, tagged JET, Layout, Style, UI, Web 
    Title:
    VBCS Application for a Jewellery retailer
    Content:

    Hi All,

    I am in the process of designing an VBCS application to enable customers buy jewellery items and looking for some guidance around designing the UI's.

    Could you kindly let me know if there are sample applications available or design principles which i can reuse or adopt.

    Thanks,

    Nagesh.

  • Aishwarya Sharma
    Horizontal Scrollbar of ojtable is hidden when the specified...
    Topic posted November 27, 2019 by Aishwarya Sharma, tagged JET, Layout, Style, UI 
    Title:
    Horizontal Scrollbar of ojtable is hidden when the specified height is reached
    Content:

    Hi ,

    I am a facing weird issue regarding scroll bar in VBCS. In the style property of ojtable, I specified the height as 500 px and width as 900 px. I am able to see horizantal scroll bar until the height of table reaches 500 px. When I inspected the page, I found the below table properties:

    element.style {

    height: 500px;

    width: 900px;

     overflow: hidden;

    }

    If I remove tick mark from overflow:hidden under inspect, I am able to see horizontal scroll bar.

    Hence, I tried giving overflow:auto or overflow:visible in style property of oj table but it didnt help. Also I tried giving overflow-x:auto in the div surrounding the table but it also didnt work out.

    I am seeing this issue in chrome and not in firefox.

    Kindly let me know if anyone has any fix for this.

    Regards,

    Aishwarya

    Version:
    VIsual Builder Version : 19.3.1.4
  • Nandan
    oj-table td element colspan1
    Topic posted October 10, 2019 by Nandan, tagged Layout, Style 
    Title:
    oj-table td element colspan
    Summary:
    colspan attribute of td element in oj-table
    Content:

    Hi,

    I am using oj-table to display rows of data, with each row having a different layout. I am achieving this using <oj-bind-if> inside column template slot and referring to a value in the current row ($current.row.row_type ) to dynamically decide what to render in the row.

    I need to merge columns if the row is of a certain type ($current.row.row_type) and I plan to use colspan attribute of td element. But I noticed that VBCS/Jet adds its own td element even if I wrap the contents of <oj-bind-if> within <td> </td>. I am able to achieve this using a Javascript function called from an action chain. But this approach is not very stable and I am looking for a VBCS declarative/CSS approach.

    Can I stop VBCS/JET from adding its own td tag and force it to consider the td tag provided in the template slot?

     

     

     

    Version:
    Version: 19.3.1.2
    Image:
  • Venkata P
    How to change background color of a particular page without...1
    Topic posted October 9, 2019 by Venkata PGreen Ribbon: 100+ Points, tagged Style, UI 
    Title:
    How to change background color of a particular page without changing shell
    Summary:
    I have a requirement to make background color as grey in a particular page
    Content:

    Hi Champs,

    1. I have a requirement to make background color as grey in a particular page but I dont want to make these changes in shell. 

    2. I am unable to do fill a row in start page with 100 % screen width. It is showing with left and right with a border with background color specified in shell. How can I achieve full 100 % width. Attached a sample screenshot.

    Regards,

    Venkat

     

    Version:
    19.3.1.2
    Image:
  • Hugo Zandt
    How to make a VBCS login page that uses Oracle Identity...35.0
    Topic posted October 8, 2019 by Hugo ZandtGreen Ribbon: 100+ Points, tagged Action Flows, REST, SaaS Integration, Security, Services, Style, UI, Web 
    Title:
    How to make a VBCS login page that uses Oracle Identity cloud
    Summary:
    How to create a login page in VBCS that uses the default oracle identity cloud service to authenticate users.
    Content:

    Hello,

    Goal

    We would like to create a login page in VBCS that uses the default oracle identity cloud service to authenticate users. We want to customize the look and feel of the login page for only the users of one particular VBCS application.

    Approach

    • We have created the customized login page which contains text fields for username and password and a login button.
    • The login button has an action chain.
    • The userconfig in our app-flow.json is as follows (unaltered default values):

     "userConfig" : {

        "type" : "vb/DefaultSecurityProvider",

        "configuration" : {

          "authentication" : {

            "type" : "oraclecloud"

          }

        },

     

    Problem

    It is unclear to us how to configure an action chain that passes the username and password to the oracle identity cloud service to authenticate a user.

    We do not want to develop the actual authentication logic in VBCS, as was done in: https://cloudcustomerconnect.oracle.com/posts/6bc348535f and https://blogs.oracle.com/shay/conditional-navigation-based-on-queries-in-oracle-visual-builder-cloud-service .

    Question

    How to configure an action chain that passes a username and password to the oracle identity service to authenticate a user.

    Thanks,

    Hugo

     

    Version:
    19.3.1.2.
  • Sridhar Yerram
    VBCS- Table Border Size3
    Topic posted October 5, 2019 by Sridhar YerramRed Ribbon: 250+ Points, tagged Style, UI 
    Title:
    VBCS- Table Border Size
    Content:

    Hi ,

    Want to know, how do we change the table border size in flow? Is it possible to modify ?

    -Sridhar