How can I delete a row from a Table in SAPUI5 Application when I used Model as XMLModel? - sapui5

I have created SAPUI5 application, in that I have loaded data from external .xml file into a table, it was fine. Now, I am trying to delete a specific row from that table.
For this purpose, I use this code:
var oModel = new sap.ui.model.xml.XMLModel();
oModel.loadData("Deployments.xml", "", false);
sap.ui.getCore().setModel(oModel);
oTable.bindRows("/service"); // here "service" is the root element of xml file
var oTable = new sap.ui.commons.Button({
text: "Delete Service",
press: function() {
var idx = oTable.getSelectedIndex();
if (idx !== -1) {
var m = oTable.getModel();
var data = m.getData();
var removed = data.splice(idx, 1); // error showing at this line
m.setData(data);
sap.m.MessageToast.show(JSON.stringify(removed[0]) + 'is removed');
} else {
sap.m.MessageToast.show('Please select a row');
}
}
});
But, I am getting error at the line: var removed = data.splice(idx, 1);. However, the same code is good for when model is JSON. How can I delete a specific row from a table when model XMLModel?

It is a lot easier an more reliable to use a Bindings BindingPath to manipulate data belonging to a particular binding. Here is your adapted sample for a XMLModel:
press: function() {
var iIdx = oTable.getSelectedIndex();
var sPath = oTable.getContextByIndex(iIdx).getPath();
var oObj = oTable.getModel().getObject(sPath);
oObj.remove();
oTable.getModel().refresh();
}
This way you save the hazzle of dealing with the XML structure and furthermore this will scale with any change in the binding path you might introduce in the future.
BR
Chris

var data = m.getData();
data is not an Array. It is a XML document.
To remove an entry from the document:
var root = data.childNodes[0];
var aEntry = root.getElementsByTagName("entry");
root.removeChild(aEntry[idx]);

Related

How to resolve Error: "[object Object]" is not valid for aggregation "persoService" of ManagedObject Table personalization

I am implementing Table personalization (sap.m.TablePersoController) that persists user-specific settings of a table on ushell services of Fiori Launchpad.
But I see below error when I run the application in Fiori Launchpad.
Error: "[object Object]" is not valid for aggregation "persoService" of ManagedObject sap.m.TablePersoController#oTablePerso
Could you let me know what is the issue and how to resolve it.
Below is the code for the same:
var oPersonalizationService= window.parent.sap.ushell.Container.getService("Personalization");
var oPersId = {
container : "AppPersSample2",
item : "mobiletable"
};
var oMobileTable = sap.ui.getCore().byId("idTable");
var oStartPersButton = sap.ui.getCore().byId("idButton");
var oPersonalizer = oPersonalizationService.getPersonalizer(oPersId);
console.log("oPersonalizer is:"+oPersonalizer);
// Create a table personalization controller
jQuery.sap.require("sap.m.TablePersoController");
jQuery.sap.require("sap.m.TablePersoDialog");
var oTablePersoController = new sap.m.TablePersoController("oTablePerso",{
table : oMobileTable,
persoService : oPersonalizer
});
// Use the personalization data to configure the table accordingly
oTablePersoController.activate();
I donĀ“t really know where the error is coming from, but for debugging you can split this line:
var oTablePersoController = new sap.m.TablePersoController("oTablePerso",{ table : oMobileTable, persoService : oPersonalizer });
into:
var oPersonalizationService = sap.ushell.Container.getService("Personalization");
var oProvider = sap.ushell.Container.getService("Personalization").getPersonalizer(oPersId);
this._oTPC = new sap.m.TablePersoController({});
this._oTPC.setPersoService(oProvider);
this._oTPC.setTable(oMobileTable);
Just try and set breakpoints.
As a example, here is my full function vor my ui.table with version 1.60.5
createPersonalization: function (viewName) {
var oTable = this.table;
// Create a persistence key
var oPersId = {
container: viewName,
item: viewName
};
// Get a personalization service provider from the shell (or create your own)
this.oPersonalizationService = sap.ushell.Container.getService("Personalization");
var oProvider = sap.ushell.Container.getService("Personalization").getPersonalizer(oPersId);
this._oTPC = new sap.ui.table.TablePersoController({
// table: oTable,
// persoService: oProvider
});
this._oTPC.setPersoService(oProvider);
this._oTPC.setTable(oTable);
},

Search help is not giving exact results in UI5

I have written code for search fields in ui5 controllers files, But the search field is not giving expected output when I pasted particular column value in input search field. Instead if I type the value in search field it is giving exact output.
I have used livechange event. I also tried with search event but unable to get the output.
I am using odata services.
Below is the controller file code:
onSearch: function(oEvt) {
// add filter for search
var aFilters = [];
var sQuery = oEvt.getSource().getValue();
if (sQuery && sQuery.length > 0) {
var filter = new Filter("UNIQUE_ID", sap.ui.model.FilterOperator.EQ, sQuery);
aFilters.push(filter);
}
// update list binding
var list = this.byId("orderTable");
var binding = list.getBinding("items");
binding.filter(aFilters);
}
View code:
Label class="sapUiMediumMarginTop" text="Unique Id"
SearchField width="150px" class="sapUiSmallMargin" liveChange="onSearch"
Please suggest me if I am missing anything.
Maybe this example can help you out? I tested your code with some random data and it worked for me.
onSearch: function(oEvent) {
var sQuery = oEvent.getParameter("query");
var oFilter1 = new Filter("Name", FilterOperator.Contains, sQuery);
var oFilter2 = new Filter("Age", FilterOperator.Contains, sQuery);
var arrFilter = new Filter([oFilter1, oFilter2], false);
// filter binding
var oList = this.byId("idList");
var oBinding = oList.getBinding("items");
oBinding.filter(arrFilter);
},

sapui5 how can i get selected item from value help into table cell?

I have a table.a column consists of input fields. How can I get value from searchHelpDialog to table item?
Below is a sample table:
And the value help dialog:
You can add the id of the field as custom data to your value help dialog.
You can get the id from the oEvent.
openValueHelpDialog: function(oEvent) {
var oDialog = sap.ui.xmlfragment();
var oField = new sap.ui.core.CustomData();
oField.setKey("field");
oField.setValue(oEvent.getParameter("id"));
oDialog.addCustomData(oField);
oDialog.open();
}`
In the handleConfirm function you can then set value into the field with the id from the custom data:
handleConfirm: function(oEvent) {
var sFieldId = oEvent.getSource().data("field");
var oField = this.getView().byId(sFieldId);
var sSelectedValue = oEvent.getParameter("selectedItem");
oField.setValue(sSelectedValue);
}
you could use a datamodel, in which the value is written when selected.
this would need to happen in the controller of the fragment you use to build the searchHelpDialog.
also the model needs to be generated, since the rows of your list probably aren't static.
Thanks friends.
Problem solved.Code;
_handleValueHelp: function(oEvent) {
this.selectedValueHelp = oEvent.getSource();
}
_handleValueHelpClose: function(oEvent) {
var oSelectedItem = oEvent.getParameter("selectedItem");
if (oSelectedItem) {
this.selectedValueHelp.setValue(oSelectedItem.getTitle());
var productInput = this.getView().byId("helpvalue");
productInput.setValue(oSelectedItem.getTitle());
}
}

How to set the value of a vizframe id to another variable ( using this.getView().byId) using sapui5

I am using the using the sap webide. In my application I have some vizcharts binded to Odata. Now I am trying to download the vizcharts as PDF. But I am unable to get the value of vizcharts.
Below is my code from JS controller.
downloadClickHandler: function(oEvent) {var str = "width=500px,height=600px";
var wind = window.open("", "PrintWindow", str);
var chart = this.getView().byId("idVizFrameCountofTransactionUsed");
var Details = chart["sId"];wind.document.write(Details);
wind.print();
wind.close();
},
You can achieve it by:
_onDownload : function() {
var oVizFrame = this.byId("chartContainerVizFrame");
var oModel = oVizFrame.getModel();
var oData = oModel.oData;
}
In oData object now you have data from the chart. Please have a look in this example, and press download icon.

Sapui5 load Data pass by parameter

I am learning sapui5. I want pass my model data vitw parameter. I tried this but I think this is very bad a choice. How can I fix this?
var view = this.getView();
var model = new sap.ui.model.json.JSONModel();
var variable="testVariable";
model.loadData("......format=json&key=selectbyname&Name=" +variable+ ");
view.setModel(model);
You simply need to build the URL as string
var variable = "testVariable";
var url = "http://www.example.org/models?type=json&name=" + variable;
model.loadData(url);
view.setModel(model);
in your case it should be enough if you delete the bold part, so that you receive valid javascript:
model.loadData("......format=json&key=selectbyname&Name=" +variable + ");
to
model.loadData("......format=json&key=selectbyname&Name=" + variable );