Calling formatter with parts and static value doesn't work - sapui5

Basically I want to use a formatter function to fill the 3 properties of an sap.m.ObjectStatus (text, state, icon) depending on some static value.
<m:ObjectStatus
text="{
parts: [
{ path: 'currentRoles>STATE_TEXT' },
{ path: 'currentRoles>STATE' },
{ path: 'currentRoles>REFERENCED_ENTRY/SV_RH_ROLE_ACTIVE' },
{ path: 'currentRoles>invalid' },
{ value: 'text' }
],
formatter: '.formatter.Formatter.convertRoleStatus'
}"
...
/>
The strange thing is; if I omit the value part in the XML, the function is called. If it's included, the function gets never called in the first place.
As of the one of the answers to the post Pass Static Value to Formatter Parameters in XML View, passing parameters with value should work if the UI5 version is higher than 1.61. We use 1.71.2.
At other places in code, this works.
How to fix this issue?

Update: The issue is fixed now with commit: 4a9cf89 which will be available in 1.80+.
Now static bindings can be used even without any workarounds like the one mentioned below.
Original answer (workaround):
The issue is now reported in https://github.com/SAP/openui5/issues/2916. Thanks for making us aware of it!
A quick "fix" (I'd say a monkey patch) is to add model: 'myExistingModel' to the static binding info:
parts: [
{ path: 'currentRoles>STATE_TEXT' },
{ path: 'currentRoles>STATE' },
{ path: 'currentRoles>REFERENCED_ENTRY/SV_RH_ROLE_ACTIVE' },
{ path: 'currentRoles>invalid' },
{ value: 'text', model: 'currentRoles' }
],
This fix actually doesn't make sense since static bindings don't have any models, but can be used until the official fix arrives without the need to refactor a lot.

I suspect there is a limitation (possibly a bug):
If you do not use a named model this works for me:
...
??="{ parts : [ {path: 'a'}, {path: 'b'}, {path: 'c'}, {path: 'd'}, {value: 23} ], formatter: '.myFormatter'}"
...
let model = new JSONModel(this.getData());
this.getView().setModel(model);
...
myFormatter: function (a, b, c, d, v) {
console.log(a, b, c, d, v);
},
getData: function(){
return {"testdata": [
{ a: 1, b: "stringB", c: "stringC", d: "stringD"},
]};
}
console output: 1 "stringB" "stringC" "stringD" 23
The moment I name my model this stops working.
For now, if possible, use the default model for your data - not ideal?!
Try (you may have to do some model name trading?!) after assigning the named model as the default (un-named) model:
parts: [
{path: 'STATE_TEXT'},
{path: 'STATE'},
{path: 'REFERENCED_ENTRY/SV_RH_ROLE_ACTIVE'},
{path: 'invalid'},
{value: 'text'}
],
while this gets it to work you may want to raise this with the UI5 Team?

As for now, since changing the binding to a default one like Bernard propsed was not possible without heavy refactoring, I changed my formatter logic a bit in a way such as to create 3 seperat functions (with 4 parameters) that call the orginal convertRoleStatus function, each with different inputs for the fifth parameter, which is mode.
I will report the problem with SAP to hopfully resolve it someday.

Related

VS Code DocumentSelector for all documents?

I'm writing a completion extension for VS Code. registerCompletionItemProvider() requires a DocumentSelector selector to specify which documents it works with. I currently have this, which seems to work, but isn't very elegant:
let provider = vscode.languages.registerCompletionItemProvider(
[{ pattern: '**', scheme: 'file' }, { pattern: '**', scheme: 'untitled' }],
{ /* other stuff */ }
);
If I leave scheme off it works as well, but VS Code gives me a guilt-trip warning implying I should keep it. Is there a simpler way to select all documents?

How to format currency BRL(Brazil) in input fields?

In my application I need to format number fields to BRL(Brazil) currency. This is my code:
new sap.ui.layout.form.FormElement(this.createId('valor'),{
label: 'Valor',
fields: [
new sap.m.Input({
value:{
parts: [{
path: '/valor'
},
{
path: 'BRL'
}
],
type: 'sap.ui.model.type.Currency',
formatOptions: {
showMeasure: false
}
},
id: this.createId('txtValor')
}),
]
}),
We suppose what my input value to be 1000.
The output it will be 1,000.00, but i need who the output to be 1.000,00
Do SAPUI5/OpenUI5 support currency BRL(Brazil)? I tried a lot, but it did not work.
The currency type uses the locale settings for formatting the output. I assume that in your case the format locale is not set to Brazilian Portugese and therefore the browser's locale is used.
You can set the format locale via:
sap.ui.getCore().getConfiguration().setFormatLocale("pt_BR");
Additionally you should also review your binding and change it to:
<Input id="valor" value="{path : '/valor', type : 'sap.ui.model.type.Currency'}"/>
Here you will find a small example. There is also an example in the Explored application explaining the model data type.

Using objects as options in Autoform

In my Stacks schema i have a dimensions property defined as such:
dimensions: {
type: [String],
autoform: {
options: function() {
return Dimensions.find().map(function(d) {
return { label: d.name, value: d._id };
});
}
}
}
This works really well, and using Mongol I'm able to see that an attempt to insert data through the form worked well (in this case I chose two dimensions to insert)
However what I really what is data that stores the actual dimension object rather than it's key. Something like this:
[
To try to achieve this I changed type:[String] to type:[DimensionSchema] and value: d._id to value: d. The thinking here that I'm telling the form that I am expecting an object and am now returning the object itself.
However when I run this I get the following error in my console.
Meteor does not currently support objects other than ObjectID as ids
Poking around a little bit and changing type:[DimensionSchema] to type: DimensionSchema I see some new errors in the console (presumably they get buried when the type is an array
So it appears that autoform is trying to take the value I want stored in the database and trying to use that as an id. Any thoughts on the best way to do this?.
For reference here is my DimensionSchema
export const DimensionSchema = new SimpleSchema({
name: {
type: String,
label: "Name"
},
value: {
type: Number,
decimal: true,
label: "Value",
min: 0
},
tol: {
type: Number,
decimal: true,
label: "Tolerance"
},
author: {
type: String,
label: "Author",
autoValue: function() {
return this.userId
},
autoform: {
type: "hidden"
}
},
createdAt: {
type: Date,
label: "Created At",
autoValue: function() {
return new Date()
},
autoform: {
type: "hidden"
}
}
})
According to my experience and aldeed himself in this issue, autoform is not very friendly to fields that are arrays of objects.
I would generally advise against embedding this data in such a way. It makes the data more difficult to maintain in case a dimension document is modified in the future.
alternatives
You can use a package like publish-composite to create a reactive-join in a publication, while only embedding the _ids in the stack documents.
You can use something like the PeerDB package to do the de-normalization for you, which will also update nested documents for you. Take into account that it comes with a learning curve.
Manually code the specific forms that cannot be easily created with AutoForm. This gives you maximum control and sometimes it is easier than all of the tinkering.
if you insist on using AutoForm
While it may be possible to create a custom input type (via AutoForm.addInputType()), I would not recommend it. It would require you to create a template and modify the data in its valueOut method and it would not be very easy to generate edit forms.
Since this is a specific use case, I believe that the best approach is to use a slightly modified schema and handle the data in a Meteor method.
Define a schema with an array of strings:
export const StacksSchemaSubset = new SimpleSchema({
desc: {
type: String
},
...
dimensions: {
type: [String],
autoform: {
options: function() {
return Dimensions.find().map(function(d) {
return { label: d.name, value: d._id };
});
}
}
}
});
Then, render a quickForm, specifying a schema and a method:
<template name="StacksForm">
{{> quickForm
schema=reducedSchema
id="createStack"
type="method"
meteormethod="createStack"
omitFields="createdAt"
}}
</template>
And define the appropriate helper to deliver the schema:
Template.StacksForm.helpers({
reducedSchema() {
return StacksSchemaSubset;
}
});
And on the server, define the method and mutate the data before inserting.
Meteor.methods({
createStack(data) {
// validate data
const dims = Dimensions.find({_id: {$in: data.dimensions}}).fetch(); // specify fields if needed
data.dimensions = dims;
Stacks.insert(data);
}
});
The only thing i can advise at this moment (if the values doesnt support object type), is to convert object into string(i.e. serialized string) and set that as the value for "dimensions" key (instead of object) and save that into DB.
And while getting back from db, just unserialize that value (string) into object again.

What exactly is "data" that is passed to responses?

I'm writing a custom response that takes data as an input, and I am finding strange properties being added, namely:
add: [Function: add],
remove: [Function: remove]
When I log out some example data, I get:
[ { books:
[ { id: 1,
title: 'A Game of Thrones',
createdAt: '2015-08-04T04:53:38.043Z',
updatedAt: '2015-08-04T04:53:38.080Z',
author: 1 } ],
id: 1,
name: 'George R. R. Martin',
createdAt: '2015-08-04T04:53:38.040Z',
updatedAt: '2015-08-04T04:53:38.073Z' },
{ books:
[ { id: 2,
title: 'Ender\'s Game',
createdAt: '2015-08-04T04:53:38.043Z',
updatedAt: '2015-08-04T04:53:38.080Z',
author: 2 },
{ id: 3,
title: 'Speaker for the Dead',
createdAt: '2015-08-04T04:53:38.043Z',
updatedAt: '2015-08-04T04:53:38.081Z',
author: 2 } ],
id: 2,
name: 'Orson Scott Card',
createdAt: '2015-08-04T04:53:38.042Z',
updatedAt: '2015-08-04T04:53:38.074Z' } ]
Which looks innocent enough, but results in the strange add and remove functions when I use a custom serializer on it. If I take this data and hard-code it straight into the serializer, those are not present. Apparently something is lurking inside of data that's not being printed to the console.
So, what is data?
Edit: So, I'm still not quite sure what other magical properties live in here, but:
Object.keys(data[0].books))
reveals
[ '0', 'add', 'remove' ]
Which is where those are coming from. Why is this included in the data passed to custom responses? And what else might be hiding in there...
More importantly, how do I strip this gunk out and make data a normal object?
JSON.parse(JSON.stringify(data));
That cleans it up nicely, though it feels like a hack. (Actually, it's definitely a hack.)
I assume your data attribute is returned by a database query. e.g.:
Model.find(...).exec(function (err, data) { ... });
But what are these .add() and .remove() methods?
Here is what you can find in the docs:
For the most part, records are just plain old JavaScript objects (aka POJOs). However they do have a few protected (non-enumerable) methods for formatting their wrapped data, as well as a special method (.save()) for persisting programmatic changes to the database.
We can go deeper:
"collection" associations, on the other hand, do have a couple of special (non-enumerable) methods for associating and disassociating linked records. However, .save() must still be called on the original record in order for changes to be persisted to the database.
orders[1].buyers.add({ name: 'Jon Snow' });
orders[1].save(function (err) { ... });
So these methods (.add(), .remove(), .save()) are useful if you play with "collection" associations.
How to remove them?
You'll need to use .toObject() which returns a cloned model instance stripped of all instance methods.
You might want to use .toJSON() that also returns a cloned model instance. This one however includes all instance methods.

How can I access a date typed field from an ExtJS JSonStore?

I've been trying to retrieve a date value and an integer value from the database, using the following code:
var l_alsChampsMois, l_stoDonneesMois;
try {
l_alsChampsMois = [
{name: "date_mois", type: "date", dateFormat: "Y-m-d"},
{name: "indice", type: "integer"}
];
l_stoDonneesMois = new Ext.data.JsonStore({
fields: l_alsChampsMois,
autoLoad: false,
proxy: {
type: "ajax",
url: "/commun/req_sql/req_ind_per_mois.php",
reader: {
type: "json",
root: "rows"
},
// some configs to use jsFiddle echo service (you will remove them)
actionMethods: {
read: "POST"
},
extraParams: {
key:"test"
}
},
listeners: {
load: function(objStore, alsLignes, blnOk, objOptions) {
window.alert("Mois fin : " + objStore.getAt(0).get("date_mois"));
}
}
});
l_stoDonneesMois.load({params: {
p_idsoc: l_strIdSociete,
p_mois: l_datDebut.getMonth() + 1,
// getMonth renvoie 0 pour janvier, etc.
p_annee: l_datDebut.getFullYear(),
p_debut: 1,
p_etape: 1
}
});
with l_strIdSociete and l_datDebut being variables previously assigned and /commun/req_sql/req_ind_per_mois.php the PHP page that retrieves the data and converts it to JSON.
It seems to work fine (indeed, Firebug tells me the load does retrieve a data structure with "date_mois" and "indice" containing the values I expect them to), only the window.alert returns undefined. If I replace "date_mois" with "indice", it returns the expected value for "indice".
I've tried to use objStore.getAt(0).getData()["date_mois"], to no avail.
My only clue about this is that "date_mois" in the data structure shown by Firebug is an Object, but even so it shouldn't be undefined, now should it? I looked up http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.Field-cfg-type that wasn't exactly forthcoming with straight answers.
So what did I do wrong there?
If you need current time you can use php time function(note: it returns seconds, JS uses milliseconds), in another case you need to convert by mktime function.