How to correctly bind a form element to newly created oData Entity in SAPUI5?

Question

I have implemented an oData Service into my SAPUI5 application.

On pressing a button the oData Model createEntry() is triggered which returns a Context with the newly created entity.

As per the SAPUI5 documentation - Documentation (Creating Entities) it should be enough to call setBindingContext(oContext) on my form to bind my new entity to my form.

But no matter how I try, I can't seem to get the binding working. The input fields remain empty (although the entity has set properties).

Do I need to keep a special syntax in mind when trying to do this kind of binding with an oData Model?

My form:

<f:SimpleForm id="form" editable="true" layout="ResponsiveGridLayout" title="Address" labelSpanXL="3" labelSpanL="3" labelSpanM="3"
    labelSpanS="12" adjustLabelSpan="false" emptySpanXL="4" emptySpanL="4" emptySpanM="4" emptySpanS="0" columnsXL="1" columnsL="1" columnsM="1"
    singleContainerFullSize="false">
    <f:content>
        <Label text="Recno"/>
        <sf:SmartField id="recno" value="{recno}"/>
    </f:content>
</f:SimpleForm>

My method that opens my dialog containing the form:

openCreateDialog: function() {
  this.getOwnerComponent().getModel("oDataModel").refreshSecurityToken(function() {
    var oContext = this.getOwnerComponent().getModel("oDataModel").createEntry("/head", {
      properties: {
        recno: "100"
      }
    });
    this.byId("form").setBindingContext(oContext);
  }.bind(this), function(data) {
    console.log(data);
  }, true);
  this.byId("CreateHeadDialog").open();
},

EDIT

I already tried {oDataModel>xxx} but this doesnt work. On the other hand, after I made my oDataModel a nameless model it seems to work fine. The smartfield correctly shows the right value, but changes I make in the UI are not applied to the property my smartfield is bound to.

When I submit pending changes of my oDataModel, all properties of my entity remain undefined, although I filled the smartfields with correct values.

Bernard Bernard · Accepted Answer · 2019-09-12T15:40:23

You are using a named model: your model name is "oDataModel" evidenced by this in your code:

.getModel("oDataModel")

When using binding syntax in your XML View you need to prefix the field with the named model name as below:

<sf:SmartField id="recno" value="{oDataModel>(your-path-to-object)recno}"/>

If it's not in a list then you would need to reference the field as below (or navigate according to the position of recno in your json hierarchy:

 <sf:SmartField id="recno" value="{oDataModel>/recno}"/>

How to correctly bind a form element to newly created oData Entity in SAPUI5?

1 Answers