Friday, April 29, 2016

OpenUI5 - Data Binding a fragment from within the XML View definition

When using fragments I had terrible trouble finding how to bind the fragment to
my data from my XML view.  Every example showed the code binding version:
this._MyDialog.bindElement("/myData");

But when using a code fragment in an XML view I didn't want to have to 
bind it from the controller.  Finally I found the answer!

<VBox>
    <core:Fragment binding="{/billingAddress}" fragmentName="myApp.Address" type="XML"
                   id="billingAddress"
    />

    <core:Fragment binding="{/shippingAddress}" fragmentName="myApp.Address" type="XML"
                   id="shippingAddress"
    />
</VBox>


This links the fragment to the billingAddress in the view's Model.   Now 
everything in the fragment is relative to that link.  
Here is the fragment definition:

<core:FragmentDefinition
        xmlns:core="sap.ui.core"
        xmlns="sap.m">
                <VBox>
                    <Input
                            id="address"
                            value="{address}"
                            tooltip="Enter Street Address"
                    />
                    <Input
                            id="city"
                            value="{city}"
                            tooltip="Enter City"
                            description="City"
                    />
                    <Input
                            id="state"
                            value="{state}"
                            tooltip="Enter State"
                            description="State"
                    />
                </VBox>
</core:FragmentDefinition>

So when the fragment is shown on the screen, the first fragment will 
update the billingAddress object and the second fragment will update
 this shippingAddress object.

No comments:

Post a Comment