I've successfully created an sap.m.Table containing, among the others, 2 columns of type sap.m.Select and sap.m.List. The data is displayed nicely. Unfortunately, I didn't manage to export these 2 columns into a spreadsheet?
The controller contains the following code to add an sap.m.Select and sap.m.List to an sap.m.Table.
var oSelectedProductList = new sap.m.List({
mode: sap.m.ListMode.None,
})
var oSelectedProductItemTemplate = new sap.m.StandardListItem({
title: "{ProductValue}",
})
oSelectedProductList.bindAggregation("items", "RnoSelectedProducts", oSelectedProductItemTemplate);
var oProductLevelTemplate = new sap.ui.core.ListItem({
key: "{TechnicalDescription}",
text: "{Description}"
});
var oProductLevelSelect = new sap.m.Select({
items: {
path: "/ProductLevel", //no curly brackets here!
template: oProductLevelTemplate,
templateShareable: false
},
selectedKey: "{ProductLevel}",
forceSelection: false,
editable: false,
width: "100%"
});
In fact, Customer Level is a sap.m.Select and Customer ID is a sap.m.List.
I don't know how I can export them using the library sap.ui.export.Spreadsheet (I can export the remaining columns).
Thanks
Related
I am trying to get the cell value of an editable column on a button click but i am getting all selected row values except the editable column value.
Please let me know how can i get the value.
Below is my code:
var oTable = new sap.ui.table.Table({
sId: "Master Table",
selectionMode : sap.ui.table.SelectionMode.Multi,
selectionBehavior: sap.ui.table.SelectionBehavior.Row,
enableCellFilter : true
});
// define the Table columns and the binding values
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "ID"}),
template: new sap.ui.commons.TextView({text:"{ID}",editable : false,filterProperty: "ID"})
}));
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "Name"}),
template: new sap.ui.commons.TextView({text:"{NAME}",editable : false})
}));
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "Address"}),
template: new sap.ui.commons.TextView({text:"{ADDRESS}",editable : false})
}));
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "PIN CODE"}),
template: new sap.ui.commons.TextView({text:"{PIN_CODE}",editable : false})
}));
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "Mobile Number"}),
template: new sap.ui.commons.TextField({text:"",editable : true})
}));
Here mobile number is my editable field which the end user can fill in the table.
I have a button and on the click of the button i am trying to fetch the selected row values as below:
oButtonUpdate.attachPress(function(){
if(oTable.getSelectedIndices().length==0){
sap.ui.commons.MessageBox.alert("No Row Selected");
return;
}
for(var i = 0; i < oTable.getSelectedIndices().length; i++){
for(j=0;j<4;j++){
alert(oTable.getRows()[oTable.getSelectedIndices()[i]].getCells()[j].getText());
}
}
});
Now the above code only returns me till PIN Code.
How can i get the value of the editable cell.
Thanks in advance
I don't think it has anything to do with the cell being editable.
While "TextView" has "getText()" to retrieve the value, "TextField" has "getValue()".
See the documentation link here.
Either you change the TextField to a TextView (if possible), or you adjust your loop to the following snippet:
for(j=0;j<4;j++){
var oControl = oTable.getRows()[oTable.getSelectedIndices()[i]].getCells()[j];
if (oControl.getText) {
alert(oControl.getText());
}
else if (oControl.getValue) {
alert(oControl.getValue());
}
}
The "else if" part is optional since just "else" would suffice in this case.
I am using sap.m.Table to display some documents as a sap.m.Dialog.The UI looks as below:
Everything works as expected but when I scroll to the last Item (growing=true) the table rerenders and moves back to the top. Ideally that would happen only when I refresh a model. I am using bindAggregation to bind the odataModel to the UI. Please see a snippet below (Note:Partial snippet).
var dialog = new Dialog({
title: title,
buttons: [
new sap.m.Button({
text: "{i18n>close}",
press: function(oEvt) {
dialog.close();
}
})
]
});
var table = new sap.m.Table({
width: "100%",
inset: true,
growing: true,
growingThreshold: 100,
growingScrollToLoad: true
})
dialog.addContent(table);
if (!dialog.isOpen()) {
dialog.open();
}
var oDModel = new ODataModel(kmURL, {
json: true
});
oDModel.setDefaultBindingMode(sap.ui.model.BindingMode.OneWay);
table.setModel(oDModel);
var mParams = {
path: "/DocumentQuerySet",
template: template,
};
table.bindAggregation("items", mParams);
I think that bindAggregation internally refreshes the model which forces the table to rerender after every data call. How can I avoid the model to refresh/rerender the table so that it does not scroll to the top every time the user scrolls down to see more data.
Appreciate any help.
Thanks.
You could fix this problem by placing the Table control within a ScrollContainer. The ScrollContainer will handle the growing feature of the table, which causes the change in height of the control. This will retain the current position without moving back to the top.
....
var table = new sap.m.Table({
width: "100%",
inset: true,
growing: true,
growingThreshold: 100,
growingScrollToLoad: true
})
var oScroll = new sap.m.ScrollContainer({
width: "100%",
height: "500px",
vertical: true,
content: table
})
dialog.addContent(oScroll);
....
I am using combo box in a table having two fields as male and female and if i change that value to be stored in the JSON model data..How to use an event to it..
The following is my code
oTable.addColumn(new sap.ui.table.Column( {
label: new sap.ui.commons.Label({text: "Gender"}),
template: new sap.ui.commons.ComboBox(
{items: [new sap.ui.core.ListItem({text: "Female"}),
new sap.ui.core.ListItem({text: "Male"})]}).bindProperty("value","gender"),
sortProperty: "gender",
filterProperty: "gender",
enabled : true,
change: function(oEvent){
sap.ui.getCore().byId("gender").setValue(oEvent.oSource.getSelectedItemId());
},
width: "75px"
}));
function change(oEvent){
var bEnabled = oEvent.getParameter("enabled");
// modify the enabled property value in the model to reflect changes
oModel.setData({enabled: bEnabled}, true); // true means merge the data instead of replacing
};
But it is not reflecting the values..please correct the code.
you should move your `change` function to the combobox, currently is is attached to the column (which does not have an event like that).
you can put your `bindProperty`-call to the constructor
in the event-function you have to get the model and change its value.
new sap.ui.commons.ComboBox({
value: "{gender}",
items: [
new sap.ui.core.ListItem({
text: "Female"
}), new sap.ui.core.ListItem({
text: "Male"
})
],
change: function(oEvent) {
var newValue = oEvent.getParameter("newValue");
var bindingPath = this.getBindingPath("value");
this.getModel().setProperty(bindingPath, newValue);
}
})
How can I get index of pressed ColumnListItem? I want to get and pass to controller method.
View code:
var oTable = new sap.m.Table({
id: "Countries",
mode: sap.m.ListMode.None,
columns: [ new sap.m.Column({
width: "1em",
header: new sap.m.Label({
text: "Name"
})
})
]
});
var template = new sap.m.ColumnListItem({
id: "first_template",
type: "Navigation",
visible: true,
selected: true,
cells: [ new sap.m.Label({
text: "{name}"
})
],
press: [oController.pressListMethod]
});
oTable.bindItems("/eventos", template, null, null);
oPage.addContent(oTable);
Controller code:
pressListMethod: function(index){
var oData = sap.ui.getCore().getModel().getProperty("/eventos/"+index+"/name");
alert(oData);
}
You shouldn´t rely on the index since the index in the table can differ from the index in your model (e.g. due to filtering and sorting).
You can read the bindingContext of the pressed ListItem like this:
pressListMethod: function(event){
var bindingContext = event.getSource().getBindingContext();
}
The bindingContext is an artificial object containing the related model and a path of the object within the model.
You can then read properties of your object like this:
var name = bindingContext.getProperty("name");
To get the whole object you can do it like this:
var myObject = bindingContext.getObject();
To get exact value of product
SelectedRowContext.getObject('PRODUCT_ID')
To get Name of product
SelectedRowContext.getObject('NAME')
I have a table when I try to bind the column of this table to a json data. It works in one of my tables and in other tables it doesn't show anything. I checked content and the way I get the json data and it is exactly the same in all tables.
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "Names"}),
template:
new sap.ui.commons.Link({
text:"{name}",
})
}));
the table that shows the content sits in shell and other tables that show nothing sit inside sap.ui.ux3.ThingGroup. I am wondering if the reason that I don't see the binding is because of ThingGroup or not? because as soon as I change the sap.ui.commons.Link to sap.ui.commons.TextView it works.
The cut down version of my code is:
addLayerTable: function(){
var jsonData1 = {
"layers" : []
};
$.getJSON(URI, {}).done(function(data) {
if(data.layers !== undefined){
$.each(data.layers, function(i, field) {
jsonData1.layers.push({
"name" : field
});
});
}
layerDetailPage(jsonData1);
}).fail(function() {
alert("Error while reading layers Data or layers do not exist");
});
var oTable = new sap.ui.table.Table({
rows:{
path:"/layers",
},
width: "900px",
visibleRowCount: 10,
navigationMode : sap.ui.table.NavigationMode.Paginator
});
oTable.addColumn(new sap.ui.table.Column({
label: new sap.ui.commons.Label({text: "Names"}),
template:
new sap.ui.commons.Label({
text:"{name}"
})
}));
function layerDetailPage(layerData){
var oModel = new sap.ui.model.json.JSONModel();
oModel.setData(layerData);
sap.ui.getCore().setModel(oModel, "layerModel");
oTable.setModel(oModel);
};
var oFC1 = new sap.ui.ux3.ThingGroup();
oFC1.addContent(oTable);
return oFC1;
}
As soon as I change the sap.ui.commons.Label to TextView, names become visible. but at the moment nothing. Funny enough if I add a press function to my table and try to get the name of the row in the table it works although it is not visible.