Problem with element binding

[Former Member]

Hi all,

I am new to SAPUI5 development and I have a question regarding element binding. I have a table which shows all entries of an Hana table when the user clicks an entry it gets selected and the user then has the option to click on the "edit", "delete" or "add" button. In all cases a pop-up dialog is shown with a form where the selected record values gets binded on the right form elements. For this I have on each field an value entry written as follows: "value="{masterdata>CUSTOMER}"" where masterdata is my model name.

Now when the user does a Edit or Delete everything works fine (all values filled in the fields and saving changes back to database also works). However when the user does an "add" the system will not show any entries since we need to start fresh, but whenever you write something in a textfield (sap.m.Input) or change a dropdown entry (sap.m.select) it will remove the entry when you leave the input field. I tried to remove the value binding from one of the fields as a test and then I can change that specific field (the other fields containing the binding still clears the input after leaving the input field.

When I select an entry from the table and click on the edit button it will show the pop-up dialog with all entries filled in. When I then save it or cancel it and click on the add button after that it works. So after something was binded it will allow to change the entries, but when I then save the new entry and perform a model refresh it will save the new entry indeed to the database and it will update the table on the screen with the new value, but also the entry I clicked before to do an edit will get these new values on the table. This is only on the model though because after a refresh that entry gets the old value back again.

So although I did manage to bind a selected value in the form element without writing any JavaScript code for the binding itself, it does seem to give issues when there is no value to bind. Am I missing something here or does anyone know what is happening?

Kind Regards,

Nico van der Linden

[former_member182372 · Accepted solution]

so much text but not code

[Former Member · Accepted solution]

Hi Maksim,

you’re right, sorry. I tried to explain what was happening and had a more general question regarding Element Binding but I might indeed explain better what happens if I show the code I execute as well.

First of all I have a controller file in which I define a xml fragment:

_getDialog: function() {

     if (!this._oDialog) {

          this._oDialog = sap.ui.xmlfragment("AssignmentFragment","pvm.mdm.view.AssignmentDialog", this);

          this.getView().addDependent(this._oDialog);

       }

       return this._oDialog;

}

Then I have a table on the view which shows the content of an Hana Table, I have a model (master data) which points to my xsodata file where all the table are defined. The user can select an entry from the table and then click on either an ‘Add’, ‘Edit’ or ‘Delete’ button. In all cases it will open a method called “onOpenDialog” with an oEvent input variable of the method I can find out which button was pressed and perform an action based on the users decision.

The code will open the xmlfragment (from the onOopenDialog method) by using the call “this._getDialog().open();”. Then I will get a reference to the form (with ID assignmentCustomer) with the command:

var oForm = sap.ui.getCore().byId("AssignmentFragment--assignmentCustomer");

Then I decide (in case of an edit or delete) which table row was selected with the command:

var sPath = this.oTable.getSelectedContexts()[0].getPath();

Finally I bind the selected value to the form with the command

oForm.bindElement({ path: sPath, model: "masterdata" });

In the form itself I use a simpleForm on which I perform element Binding on all of the input fields as follows:

<f:SimpleForm

                    id="assignmentCustomer"

                    minWidth="1024"

                    maxContainerCols="2"

                    editable="true"

                    layout="ResponsiveGridLayout"

                    title="Source System: Iberia"        

                    labelSpanL="4"

                    labelSpanM="4"

                    labelSpanS="4"

                    emptySpanL="1"

                    emptySpanM="1"

                    emptySpanS="1"

                    columnsL="2"

                    columnsM="1"

                    columnsS="1"                   

                    class="editableForm">

                    <f:content>

                        <core:Title

                            text=""

                            titleStyle="H3" />

                        <Label

                            labelFor="CUSTOMER"

                            text="Customer ID"/>

                        <Input

                            id="CUSTOMER"

                            required="true"

                            value="{masterdata>CUSTOMER}" />

                        <Label

                            labelFor="DESCRIPTION"

                            text="Customer Description"/>

                        <Input

                            id="DESCRIPTION"

                            value="{masterdata>DESCRIPTION}" />

  ……

When I chose an entry from the table in the view and click on edit or delete the selected table value gets successfully binded in the respective fields of the form, however, when I choose Add there is nothing to bind and it indeed shows empty fields but when I change any field and press tab the content gets cleared again.

So My question is if I am doing anything wrong? I can solve it but creating a separate “add” and “edit/delete” form but that sounds not like a good solution because I would then have to duplicate the exact same xml fragment twice (with the only difference that I don't add the value binding on the add fragment)?

Hopefully this explains a bit more what I am doing and what is happening?

Kind Regards,

Nico

[Former Member · Accepted solution]

In meantime I now see that you indeed have to use a separate 'add' and 'edit' or even 'display' view.