Getting and setting the default Model once another has been setup - sapui5

My issue is that I have a default model specified in my manifest.json file as "".
However, I'm also setting up a view model in my controller.
var oModel = new JSONModel({
questions: [{
order: 1,
title: "",
criteria: "",
}]
});
this.getView().setModel(oModel);
How do I restore set the view model back to the default model?
Is it simply a case of
this.getView().setModel("");
I'm asking because the default model is the service that contains all my read/writes.

You should set named models after setting the default model.So your code should be changed like
var oModel = new JSONModel({
questions: [{
order: 1,
title: "",
criteria: "",
}]
});
this.getView().setModel(oModel,"newModelName");
Now you can get default model by
this.getView().getModel()
and named json model by
this.getView().getModel("newModelName");

The solution was in the way the additional model was initialised and accessed, but naming it and referring to it as 'viewmodel'
This way, the default model can still be setup using
oModel = this.getView().getModel();
In the Controller:
this.getView().setModel(oModel,"viewmodel");
var oContext = oModel.createBindingContext("/questions/0/");
this.getView().setBindingContext(oContext,"viewmodel");
In the view :
title="Question {viewmodel>order}"

Related

How to bind a form in SAPUI5?

I was trying to figure out how to bind a simple form in UI5 (not a list) so I can submit to my oData backend . How do I do that with a simple form?
Here is my controller code (if I were to do in a List) - But I have no clue how to deal with a Form:
var oList = this.byId("addapp"),
oBinding = oList.getBinding("items"),
// Create a new entry through the table's list binding
oContext = oBinding.create({
"application_id": 0,
"product_name_short": 'Test',
});
This is what I have tried so far, but I got undefined value:
var x =this.getView().byId("addapp").getBinding("items");
If you have set a model to your view, you can bind an existing object to a view using Element.bindElement:
this.getView().byId("addapp").bindElement("/path/to/your/object");
If you want to use a temporary model (to use the data once you click "add" or something similar):
onInit: function () {
// Initial values of the form
this.getView().setModel(new sap.ui.model.json.JSONModel({
property1: "",
property2: "",
property3: ""
}), "newEntry");
// Bind the form to the json model
this.getView().byId("addapp").bindElement("newEntry>/");
},
onAddButtonClick: function() {
// Get the form values
var newEntry = this.getView().getModel("newEntry").getData();
// Use the OData model to create a new entity
var oDataModel = ...;
oDataModel.create("/path/to/your/entityset", newEntry, {
success: function() {
// entity was created
}
});
}

How to Bind json object in array sapui 5?

My file controller.js,
Now want to bind json object in array using sapui 5. I am try below code for it.
onInit: function() {
var elementArray=['ID','Name','Description','ReleaseDate','DiscontinuedDate','Rating','Price'];
var oModel = new sap.ui.model.json.JSONModel(elementArray);
sap.ui.getCore().setModel(oModel,'fieldArray');
// var oModel = new sap.ui.model.json.JSONModel('./smartappall/door.josn');
// sap.ui.getCore().setModel(oModel,'approcords');
},
view.js
var elementArray= bind fieldArray json model here
I'm not sure what you are trying to achieve, but since your model only contains the array, in your view you can do the following:
var elementArray = sap.ui.getCore().getModel("fieldArray").getData();
(EDITED: Forgot the getData() part...)
But generally, you don't store objects or arrays in a dedicated model, but rather have one model where you store them in separate properties. In that case, you can do:
In controller:
sap.ui.getCore().getModel("fieldArray").setProperty("/pathToYourArray", elementArray");
In view:
var elementArray = sap.ui.getCore().getModel("fieldArray").getProperty("/pathToYourArray");
The JSONModel data must be a plain javascript object. IE not a javascript array.
You can either follow the previous answer and set your array as a property of the JSONModel, or modify your initial array to wrap it inside an object :
onInit: function() {
var data = { elementArray: [
'ID',
'Name',
'Description',
'ReleaseDate',
'DiscontinuedDate',
'Rating',
'Price'
]};
var oModel = new sap.ui.model.json.JSONModel(data);
sap.ui.getCore().setModel(oModel,'fieldArray');
},
Then you can bind your view to {fieldArray>/elementArray}

Populating Combobox in a Table Column

I have tied an ODataModel with a table. In the table one of the columns is dropdown list. The list has some 3 values. It's slightly confusing for me but how to go with such scenario? Do I have to tie another model consisting of the values I want in the dropdown and then have it's property bound to the response coming from the ODataModel which is tied to the table?
Is the following thing correct? but it may not be good if I have more values to be there in the dropdown and morever.... how to proceed if I want to bind this "key" mentioned below with "Status" in the ODataModel? Here I have tied the "value" property of combobox to the "StatusText" coming from ODataModel.
But I want to tie the "key" property of ListItem with "Status" from ODataModel(which is tied with the table) response
oTable.addColumn(
new sap.ui.commons.ComboBox({
items: [
new sap.ui.core.ListItem({text: "New",key:"1"}).bindProperty("text","StatusText").bindProperty("key","Status"),
new sap.ui.core.ListItem({text: "In Process",key:"2"}),
new sap.ui.core.ListItem({text: "Completed",key:"3"})
]
}).bindProperty("value","StatusText")
);
Any Help would be appreciated.
Thanks
This works in the table, but I think your Combobox still has some error with the bindings.
var oCombobox = new sap.ui.commons.ComboBox({
items: [
new sap.ui.core.ListItem({text: "New",key:"1"}).bindProperty("text","StatusText").bindProperty("key","Status"),
new sap.ui.core.ListItem({text: "In Process",key:"2"}),
new sap.ui.core.ListItem({text: "Completed",key:"3"})
]
}).bindProperty("value","StatusText");
oTable.addColumn(new sap.ui.table.Column({
template : oCombobox,
visible : true,
}));
Lets say you have a oData field called {Firstname}, defined in your result type (table) e.g. for this table, then you bind it in the table as:
oTable.addColumn(new sap.ui.table.Column({
template : new sap.ui.commons.TextView({
text : "{Firstname}",
textAlign : sap.ui.core.TextAlign.Center
}),
visible : true,
}));
As far as I understand, you want to get the possible values out of your oData Service, but I think this is not possible in case of an dropdown / combobox because you get a table from your backend, each line has a value in one field -> how would your bind 3 values in one single table field?
I realised dropdowns in an own service, calling the dropdown values from the backend separately:
getDropdown : function() {
// Create JSON data model
var oModel = new sap.ui.model.json.JSONModel();
oModel.loadData("/sap/opu/odata/sap/YOUR_SERVICE/YourEntitySet");
sap.ui.getCore().setModel(oModel);
// Create a DropdownBox
var oDropdown = new sap.ui.commons.DropdownBox("DropdownBox", {
text: "{Firstname}",
});
oDropdown.setModel(oModel);
var oItemTemplate1 = new sap.ui.core.ListItem({
text : "{Firstname}",
});
oDropdown.bindItems("/d/results", oItemTemplate1);
// "/d/results" may vary depending on your path
// return the box
return oDropdown;
},
you can use the returning result in your table.
e.g. in view:
var dropdown = oController.getDropdown();
dropdown.placeAt("content");

How to display JSONModel data using "sap.ui.table.DataTable"?

I'm trying to bring data from an internal table in a ABAP program into an SAPUI5 application.
From the ABAP side, I have converted the required data into JSON format and sending it across like it is mentioned in the a guide.
I have written the following code in the 'Read' section of the controller
$.ajax({
type: 'GET',
url: 'http://socw3s1er67.solutions.glbsnet.com:8000/sap/bc/Z_tets_json?sap-client=950',
success: function(data) {
alert(data[1].PROJECT);
alert(data[0].MANDT);
var oModel_Projects = new sap.ui.model.json.JSONModel();
oModel_Projects.setData({ modelData: data });
}
});
Sample JSON response from the server:
[
{
"MANDT": "PJ1",
"PROJECT": "Test Project1",
"DESCRIPTION": ""
},
{
"MANDT": "PJ2",
"PROJECT": "Test Project2",
"DESCRIPTION": ""
}
]
The alerts seem to be working fine and are returning expected data from the internal tables.
I want to know: how to bind this data into a particular table using models?
Well, your code looks ok, but there are other parts, which are missing, and there might be a problem there...
How is your table constructed - ?
It should be:
var table = new sap.ui.table.DataTable({
title: 'My first table',
width: '100%'
});
Do you make following calls to connect table and model?
table.setModel(oModel_Projects);
table.bindRows("modelData");
Are you properly creating columns of the table?
label = new sap.ui.commons.Label({ text: 'Client' });
template = new sap.ui.commons.TextView({ text: '{MANDT}' });
col = new sap.ui.table.Column({ label: label, template: template });
table.addColumn(col);
Is table properly placed into HTML using placeAt method?
Updated the answer after your clarification:
Try this parser:
var html = "<table><tr><td>MANDT</td><td>PROJECT</td><td>DESCRIPTION</td></tr>";
for(var index in data){
html+="<tr><td>"+data[index].MANDT+"</td><td>"+data[index].PROJECT+" </td><td>"+data[index].DESCRIPTION+"</td></tr>";
}
html+="</table>";
//now you can insert this html into some div like as follows: $("#div1").html(html);
Or google for some jquery gridview as I suggested in the comment.

How to avoid duplicated selection model specification in ExtJS grids?

We have recently switched from ExtJS 3.2 to 3.4 and found that grids with check box selection model stop working. It turns out that such configuration is not allowed any more:
var gridConfig = {
xtype: 'grid',
store: myStore,
columns:[
new Ext.grid.CheckboxSelectionModel(),
{
id: 'Name',
header: 'Inland Carrier',
dataIndex: 'Name'
}],
sm: new Ext.grid.CheckboxSelectionModel({
checkOnly: true
})
};
Instead selection model object must be created once and then passed both to column collection and sm property.
The problem now is that we have a very long configuration object with multitude of grids. Previously selection model was specified locally as per the sample above. But now we have to allot a variable for each selection model object, invent unique name for it, and keep these variables far away from the place where they are used. It's extremely inconvenient.
Is it possible somehow to specify selection model in one place? Or maybe to create it in one property initializer and reference this object in the second place?
you can add sm to cm after initialization of grid.
ie:
var gridConfig = {
xtype: 'grid',
store: myStore,
columns:[{
id: 'Name',
header: 'Inland Carrier',
dataIndex: 'Name'
}],
sm: new Ext.grid.CheckboxSelectionModel({
checkOnly: true
})
};
var grid = new Ext.grid.GridPanel( gridConfig );
grid.getColumnModel().config.unshift( grid.getSelectionModel() );