Visual Builder

Get Involved. Join the Conversation.


    shankar vonguri
    How to use binding in VBCs
    Topic posted October 9, 2019 by shankar vonguri, tagged Business Objects, Custom Code 
    19 Views, 1 Comment
    How to use binding in VBCs
    Iam trying to implement a OJET drag and drop example from cookbook in VBCS

    Iam trying to implement a OJET drag and drop example from cookbook in VBCS

    I am new to VBCS and just working with OJET

    I have seen in previous blogs where it is suggested not to use knock out bindings in VBCS rather use page variables to bind to UI.

    In the cook book example

    lot of bindings are applied required to dynamically change the diagram nodes.

    I have 2 questions 

    1.Can we do the same in VBCS applying OJET example

    2.If it is possible How to apply the bindings dynamically when we drag and drop

    I am assuming the nodes as rows in Business Objects iam able to render the Diagram A and iam not able to implement the drop functionality as the ArrayDataProvider is not binded to UI

    Please give me some pointers how to identify the component changes 

    Do i need to use component listener in VBCS for every drag and drop and notify the business object for changes

    Here Digram A and Diagram B are two tables when i drop nodes  to Diagram B the rows with the node id in table A should be deleted and added to Table B.



    Code Snippet:



    • David Konecny

      One important thing to realise is that any variables declaratively defined in VB page cannot be modified in PageModule's JS code. Recommended pattern is to have VB action chain which calls callModuleFunctionAction (passing in any required variable values) and which in turn returns modified values, which can be then assigned back into VB variables using assignVariablesAction. So in order to convert this JET cook book example into VB I would do:

      * define few ADP variables for each node and populate them with data (to start with I would simply copy and paste data from dndDataSample.json and use them as static values)(this step will require creating Type for this data too)

      * pass ADPs into <oj-diagram>

      * layout is static function so the way you are doing it (using myfun) is correct

      * for all the drop handlers I would create regular VB event handlers which call an action chain and in that action chain I'd call custom function (tweaked onDrop function) and pass into it the array. AND the function should modify the array and return it. And the returned array then needs to be assigned back into

      That should do the trick.