on 06-22-2016 8:38 AM
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{
}
}
}
);
}
});
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
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
Madhu,
Hope this will fulfil your requirement? JS Bin - Collaborative JavaScript Debugging
Regards,
Sai Vellanki.
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
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);
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?
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"); | ||||||
} | ||||||
}); | ||||||
} |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
User | Count |
---|---|
83 | |
24 | |
12 | |
9 | |
7 | |
6 | |
5 | |
5 | |
5 | |
4 |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.