cancel
Showing results for 
Search instead for 
Did you mean: 

deletion of single row in sap ui5

former_member257196
Participant
0 Kudos

hi experts,

i have created rows dynamically and each row contains a delete button, if i click on that delete button the row should be deleted

please help me

my view.xml

<core:View xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc"

  xmlns="sap.m" controllerName="z_adding_rows.Main" xmlns:html="http://www.w3.org/1999/xhtml">

  <Page title="Title">

  <content>

  <Table id="idProductsTable" mode="SingleSelectMaster"

  selectionChange="onSelectionChange" items="{/}">

  <columns>

  <Column width="45%">

  <Label text="First Name" />

  </Column>

  <Column width="45%">

  <Label text="Last Name" />

  </Column>

  <Column width="10%">

  <Label />

  </Column>

  </columns>

  <items>

  <ColumnListItem>

  <cells>

  <Input value="{FirstName}" />

  <Input value="{LastName}" />

  <Button text="Delete" press="onDelete"/>

  </cells>

  </ColumnListItem>

  </items>

  </Table>

  <Button text="Add Row" press="onPress" />

  </content>

  </Page>

</core:View>

my controller.js

sap.ui.controller("z_adding_rows.Main", {

  onInit: function(oEvent) {

        var dataObject = [{

        FirstName: "Madhu",

        LastName: "Sudhan"

        }];

        var oModel = new sap.ui.model.json.JSONModel();

        oModel.setData(dataObject);

        sap.ui.getCore().setModel(oModel);

      },

  onPress: function(oEvent){

  var oTable = this.getView().byId("idProductsTable");

  var oModel = oTable.getModel().getProperty("/");

  var nObject = {FirstName:"", LastName:""};

  oModel.push(nObject);

  oTable.getModel().setProperty("/", oModel);

  },

      onSelectionChange: function(oEvent) {

        var oSelectedItem = oEvent.getParameter("listItem");

        var oModel = oSelectedItem.getBindingContext().getObject();

        alert(JSON.stringify(oModel));

      },

     

      onDelete : function(){

     sap.m.MessageBox.show(

       "Are you sure you want to delete this item", {

           icon: sap.m.MessageBox.Icon.WARNING,

           title: "Delete item",

           actions: [sap.m.MessageBox.Action.YES, sap.m.MessageBox.Action.NO],

           onClose: function(oAction) {

          if(oAction==="YES"){

          

          }else{

          

          }

           }

       }

     );

      }

});

Accepted Solutions (1)

Accepted Solutions (1)

saivellanki
Active Contributor
0 Kudos

Hi Madhu,

Will this sample help? JS Bin - Collaborative JavaScript Debugging

Regards,

Sai Vellanki.

former_member257196
Participant
0 Kudos

hi sai,

i have changed according to your program

onDelete : function(oEvent){

     sap.m.MessageBox.show(

       "Are you sure you want to delete this item", {

           icon: sap.m.MessageBox.Icon.WARNING,

           title: "Delete item",

           actions: [sap.m.MessageBox.Action.YES, sap.m.MessageBox.Action.NO],

           onClose: function(oAction) {

          if(oAction==="YES"){

          var oItem = oEvent.getSource().getParent();

          var oTable = oItem.getParent();

                var oIndex = oTable.indexOfItem(oItem);

                if (oIndex !== -1) {

                  var m = oTable.getModel();

                  var data = m.getProperty("/");

                  var removed = data.splice(oIndex, 1);

                  m.setProperty("/", data);

                  alert(JSON.stringify(removed[0]) + 'is removed');

                } else {

                  alert('Please select a row');

                }

          }else{

          return;

          }

           }

       }

     );

      }

the Error am getting is : Main.controller.js:37 Uncaught TypeError: Cannot read property 'getParent' of null

saivellanki
Active Contributor
0 Kudos

Madhu,

Hope this will fulfil your requirement? JS Bin - Collaborative JavaScript Debugging


Regards,

Sai Vellanki.

former_member203031
Contributor
0 Kudos

Hi Madhu,

If possible u please check in the console by placing a break-point what are the possibility properties does that consist then u can describe the error some more briefly.

Thanks,

Deepak Raj.

former_member257196
Participant
0 Kudos

thank you sai

former_member257196
Participant
0 Kudos

hi sai,

what if that Product( i mean data )  is defined in another controller?

saivellanki
Active Contributor
0 Kudos

Store the value in a model property, and get it.

Regards,

Sai Vellanki.

former_member257196
Participant
0 Kudos

hi sai,

can i get an example please

thank you

former_member257196
Participant
0 Kudos

HI SAI,    

it giving error

Cannot read property 'getProperty' of undefined

saivellanki
Active Contributor
0 Kudos

Code?

former_member257196
Participant
0 Kudos

hi sai,

component.js

var dataObject =  [{

           Description: "FGDSDOLA0050",

           Quantity: "10"

         }];

         var oModelRow = new sap.ui.model.json.JSONModel();

         oModelRow.setData(dataObject);

        sap.ui.getCore().setModel(oModelRow);

controller1.js

onPressDelete1 : function(oEvent){

  debugger;

  var oItem = oEvent.getSource().getParent();

        var oTable = oItem.getParent();

        var oDescription = oItem.getBindingContext().getProperty("Description");

        var oIndex = oTable.indexOfItem(oItem);

        this.getView().getModel().setProperty("/oIndex", oIndex);

        sap.m.MessageBox.alert(

          "Are you sure you want to delete - " + oDescription + " ?", {

            icon: sap.m.MessageBox.Icon.WARNING,

            title: "Delete Item",

            actions: [sap.m.MessageBox.Action.YES, sap.m.MessageBox.Action.NO],

            onClose: function(oAction) {

              if (oAction === "YES") {

                var m = oTable.getModel();

                var data = m.getProperty("/");

                var removed = data.splice(oIndex, 1);

                m.setProperty("/", data);

                sap.m.MessageToast.show(JSON.stringify(removed[0]) + 'is removed');

              } else {

                return false;

              }

            }

          }

        );

  }

same given in Controller2.js but its giving error as not read Cannot read property 'getProperty' of undefined

former_member257196
Participant
0 Kudos

hi sai,

i have given like this please check,

var oDescription = oItem.getBindingContext().getProperty("TempTableDataModel>Description");

saivellanki
Active Contributor
0 Kudos

Madhu,

It should be:


oItem.getBindingContext("TempTableDataModel").getProperty("Description");

Regards,

Sai Vellanki.

former_member257196
Participant
0 Kudos

hi sai,

hi have used this method also getting same error  : Cannot read property 'getProperty' of undefined

my model in another view

var dataObject =  [{

          Description: "FGDSDOLA0050",

          Quantity: "10"

        }];

        var oModelRow = new sap.ui.model.json.JSONModel();

        oModelRow.setData(dataObject);

        this.getView().setModel(oModelRow);

saivellanki
Active Contributor
0 Kudos

Previous response you had a model name, now you don't have it.

Try:


this.getView().getModel().getProperty("/0/Description");

Regards,

Sai Vellanki

former_member257196
Participant
0 Kudos

same error

actually the description is from another view na, how can we use this.getView()

former_member257196
Participant
0 Kudos

hi sai,

any solution ?

thanks

former_member257196
Participant
0 Kudos

hi sai,

do you know how to validate these field in User interface,

i have given like this

var input9 = this.getView().byId("idselectMaterialItem").getValue();

     if (input9 === ""){

      this.getView().byId("idselectMaterialItem").setValueState("Error");

      flgDescription = '1';

     }else{

      this.getView().byId("idselectMaterialItem").setValueState("Success");

      flgDescription = '0';

     }

    

     var input10 = this.getView().byId("idinput2").getValue();

     if (input10 === ""){

      this.getView().byId("idinput2").setValueState("Error");

      flgQuantity = '1';

     }else{

      this.getView().byId("idinput2").setValueState("Success");

      flgQuantity = '0';

     }

its validating normal fields but not this cells

can u help?

saivellanki
Active Contributor
0 Kudos

Madhu,

Did you check this blog?

Regards,

Sai.

Answers (1)

Answers (1)

Former Member
0 Kudos
onDelete: function(oEvent) {
var oModel = this.getView().getModel();
var sPath = oEvent.getSource().getBindingContext().sPath;

oModel.remove(sPath, {
success: function() {
sap.m.MessageToast.show("Delete item");
},
error: function() {
sap.m.MessageToast.show("Item deletion failed");
}
});
}