How to bind a form in SAPUI5? - 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
}
});
}

Related

How to give configurable URL in tableau WDC

I am trying to build a tabeau WDC.
this is my code
(function () {
var myConnector = tableau.makeConnector();
myConnector.getSchema = function (schemaCallback) {
var cols = [{
id: "month",
dataType: tableau.dataTypeEnum.string
}, {
id: "value1",
alias: "value1",
dataType: tableau.dataTypeEnum.float
}, {
id: "value2",
alias: "value2",
dataType: tableau.dataTypeEnum.float
}];
var tableSchema = {
id: "testfeed",
alias: "test Feed",
columns: cols
};
schemaCallback([tableSchema]);
};
myConnector.getData = function (table, doneCallback) {
$.getJSON('http://test.com/view?name=test&filters=[{"type":"number","id_equals":["123"]}]', function (resp) {
var feat = resp.DATA,
tableData = [];
// Iterate over the JSON object
for (var i = 0, len = feat.length; i < len; i++) {
tableData.push({
"MONTH": feat[I].month,
"ChargeEntryLag_NUMERATOR": feat[i]. value1,
"ChargeEntryLag_DENOMINATOR": feat[i]. value2
});
}
table.appendRows(tableData);
doneCallback();
});
};
tableau.registerConnector(myConnector);
$(document).ready(function () {
$("#submitButton").click(function () {
tableau.connectionName = "testFeed";
tableau.submit();
});
});
})();
my URL contains some filters as shown in the above code, so if U want to get data for a particular filter I have to hardcode it in URL and the use it.
In other word my URL is static , Is there a way to make it dynamic.
suppose I want the value of 'id' to be 10in my filter, for that I have to go the the WDC code and change it. can it be made configurable.
use tableau.connectionData to pass data. There is an example in this tutorial:
https://tableau.github.io/webdataconnector/docs/wdc_multi_table_tutorial
Typically you'd create a form. When you connect with the WDC in tableau desktop, you put in the URL of your form. The form will store the form vars in tableau.connectData. Your getData can then take those and create a custom Data Source inside tableau desktop for you.
- Mike

validate subDocuments in a dictionary in Mongoose

I have a userTasteSchema, with a dictionary field favorites composed by
favoriteSchema objects. When I save or update a userTaste, I want to validate that the elements of the dictionary are valid favorite objects.
Is it possible?
thank you
var userTasteSchema = new Schema(
{
favorites : {type: { /* dictionary of favorites */ }, default:{} }
});
var favoriteSchema = new Schema(
{
name : {type:{String}}
});
You have to change your model declaration. According to the docs your code should look like:
var userTasteSchema = new Schema(
{
favorites : [ favoriteSchema ]
});
var favoriteSchema = new Schema(
{
name : {type:String}
});
And that's pretty much it. When you save your parent document, UserTaste, your children validations are run as well. Here is the reference
Validation is asynchronously recursive; when you call Model#save,
sub-document validation is executed as well. If an error occurs, your
Model#save callback receives it

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.