Neue Zeile in vorhandene Tabelle hinzufügen

Question

Ich möchte neue Zeile mit vorhandenen Tabelle hinzufügen.

mein Code:

onInit: function() { 
    var oModel = new sap.ui.model.json.JSONModel("Model/Clothing.json"); 
    this.getView().setModel(oModel); 
    var table = this.getView().byId("tableid"); 
    table.bindItems("/catalog/clothing/categories", new sap.m.ColumnListItem({ 
     type: "Navigation", 
     press: function(evt) {}, 
     cells: [ 
     new sap.m.Text({ 
      text: "{name}" 
     }), new sap.m.Text({ 
      text: "{amount}" 
     }), new sap.m.Text({ 
      text: "{currency}" 
     }), new sap.m.Text({ 
      text: "{size}" 
     }) 
     ] 
    })); 
    table.setModel(oModel); 
    }, 
    onPress: function(oEvent) { 
    var table = this.getView().byId("tableid"); 
    var items = table.getSelectedItems(); 
    for (var i = 0; i < items.length; i++) { 
     var data = new sap.m.ColumnListItem({ 
     cells: [new sap.m.Text({ 
      text: "new Row1" 
     }), new sap.m.Text({ 
      text: "new row1" 
     }), new sap.m.Text({ 
      text: "new row1" 
     }), new sap.m.Text({ 
      text: "new row1" 
     })] 
     }); 
     table.addItem(data); 
    } 
    }, 

<Table id="tableid" mode="MultiSelect" select="addRows"> 
    <columns> 
    <Column> 
     <Text text="column1" /> 
    </Column> 
    <Column> 
     <Text text="column2" /> 
    </Column> 
    <Column> 
     <Text text="column3" /> 
    </Column> 
    <Column> 
     <Text text="column4" /> 
    </Column> 
    </columns> 
</Table> 
<Button text="Edit" press="onPress" /> 

Hier ist meine Ausgangsbild

nun genau das, was ich erreichen will,

1. ich wählen Sie ein Kontrollkästchen.
2. Dann werde ich auf Edit Knopf drücken.
3. nun auf die Presse Edit Taste I want to add one more row below selected checkbox row.

So kann ich dies erreichen.

Hinweisjetzt die neue Zeile zuletzt in der Tabelle angegebenen Index

Answer 1

Verwenden insertItem einfügen Element hinzufügen.

Es dauert zwei Argumente viz. hinzuzufügender Artikel und Index, zu dem er hinzugefügt werden soll.

Also zuerst Index des Elements, unter dem Sie Element mit indexOfItem hinzufügen möchten, dann verwenden Sie diesen Index +1 als Index für neues Element.

Here ist eine Demo.

Answer 2

Wenn Sie Daten verwenden zu binden, sollten Sie auf jeden Fall nicht eine neue Tabellenzeile Steuerelement hinzufügen - stattdessen fügen Sie einen neuen Eintrag in die Modellknoten:

EDIT: aktualisiert meine Antwort:

onPress : function(oEvent) { 
    var oModel = this.getView().getModel();        // the model 
    var aRows = oModel.getProperty("/catalog/clothing/categories");  // array with all rows in the model 
    var oThisObj = oEvent.getSource().getBindingContext().getObject();  // the current object 
    var item  = { name: null, amount: null, currency: null, size: null } // an empty object 

    var index = $.map(aRows, function(obj, index) {       // get the index of the selected item in your array 
     if(obj === oThisObj) { 
      return index; 
     } 
    }) 

    aRows.splice(index, 0, item);           // add the item at the index 

    oModel.setProperty("/catalog/clothing/categories", aRows);    // store the array back to the model 
}