I am developing a treegrid and have an object being passed into a formatter to generate a gfx graphic.
},{
field:"projects", name:"Projects", children:[
{field:"name", name:"Project Name", formatter: projectFormatter},
{field:"actual_cost", name:"Cost", width:'220px', formatter: costFormatter},
{field:"budget", name:"Budget"}
],
aggregate: "cnt",
itemAggregates: ["actual_cost"]
}
now the formatter function should be able to use this data....however for the life of me, I cannot get it to compute the values in the formatter
Any help is appreciated
Try passing a nameless function to the formatter:
...,formatter: function(value){return getExtImg(value);},...
In there you can call your custom function by name. Dont forget to return a value in your formatter function !
Related
I am using react-native-chart-kit pie chart.
In the data array, instead of writing a number in the population, I am writing “this.state.data” as shown below since I am getting the numbers from an API.
const pieData1 = [
{
name: ': East',
population: this.state.data,
color: '#00664f',
legendFontColor: 'black',
legendFontSize: 12,
},
]
But I get the error "error while updating property "d" of a view managed by RNSVGPath:". Any idea how to solve it please?
Actually the thing is by default chart requires data other than empty.
just maintain some kind assign value in state.
Just typecast your state to Integer using parseInt
const pieData1 = [
{
name: ': East',
population: parseInt(this.state.data), ////
color: '#00664f',
legendFontColor: 'black',
legendFontSize: 12,
},
I confirm this is the fix for the issue.
I experienced same error on PieChart until I realized that property I pass to as a float turned out to be a string.
JavaScript is not strong typed language - hence adding parseFloat resolved the issue.
This looks to be answered many different times but I can't seem to get it working with my implementation. I am trying to format and limit the data in a sap.m.Input element. I currently have the following:
var ef_Amount = new sap.m.Input({
label: 'Amount',
textAlign: sap.ui.core.TextAlign.Right,
value: {
path: '/amount',
type: 'sap.ui.model.type.Currency'
}
});
The first problem is that it kind of breaks the data binding. When I inspect the raw data (with Fiddler) submitted to the server it is an array like this:
"amount": [1234.25,null]
The server is expecting a single number and as such has issues with the array.
When I use the following, the binding works as desired but no formatting is performed.
var ef_Amount = new sap.m.Input({
label: 'Amount',
textAlign: sap.ui.core.TextAlign.Right,
value: '{/amount}'
});
The second problem is that the data entered is not limited to numbers.
I have tried using sap.m.MaskedInput instead but I don't like the usage of the placeholders because I never know the size of the number to be entered.
And lastly, it would be nice if when focus is placed on the input field, that all formatting is removed and re-formatted again when focus lost.
Should I be looking into doing this with jQuery or even raw Javascript instead?
Thank you for looking.
the array output is a normal one according to documentation. So you need to teach your server to acccept this format or preprocess data before submission;
this type is not intended to limit your data input;
good feature, but ui5 does not support this, because the Type object has no idea about control and it's events like "focus" it only deals with data input-output. So you have to implement this functionality on your own via extending the control or something else.
I would suggest using amount and currency separately. It's likely that user should be allowed to enter only valid currency, so you can use a combobox with the suggestions of the available currencies.
So, after much work and assistance from #Andrii, I managed to get it working. The primary issue was that onfocusout broke the updating of the model and the change event from firing. Simply replacing onfocusout with onsapfocusleave took care of the issues.
The final code in the init method of my custom control:
var me = this;
var numberFormat = sap.ui.core.NumberFormat.getCurrencyInstance({maxFractionDigits: 2});
me.addEventDelegate({
onAfterRendering: function() {
// for formatting the figures initially when loaded from the model
me.bindValue({
path: me.getBindingPath('value'),
formatter: function(value) {
return numberFormat.format(value);
}
});
},
onfocusin: function() {
// to remove formatting when the user sets focus to the input field
me.bindValue(me.getBindingPath('value'));
},
onsapfocusleave: function() {
me.bindValue({
path: me.getBindingPath('value'),
formatter: function(value) {
return numberFormat.format(value);
}
});
}
});
I would like to have my Feature Table display sorted on the first column when it first appears instead of requiring the user to sort it by clicking on the column header. I have not been able to find a method to do this.
Not sure if this is the best solution, it would be nice to be able to set this in the constructor, but if you call myFeatureTable.grid.set('sort', [{ attribute: ''}]); after the grid fires it's load event, this will sort it before it appears in the UI. For example:
on(myFeatureTable, "load", function(){
myFeatureTable.grid.set('sort', [{ attribute: "<attribute used in first column>"}]);
});
Another method if you have not required dojo/on, you can use the on method of the feature table.
myFeatureTable.on('load', function () {
// Sort on the Name attribute
myFeatureTable.grid.set('sort', [{ attribute: "Name" }]);
})
i have a grid panel with a column that if you click you downalod a file associate to this row.
In extjs 2 i just define a new renderer that is a function who return only return the String format of an url like this:
function DownaloadFile(value, metadata, record, rowIndex, colIndex, store)
if (record.data.id){
return String.format('<b><img src="<c:url value="/icons/icon_download.gif"/>"/></b>',record.data.id);
}
This syntax is not rigth in ExtJS4.2 because String.format is now Ext.String.format but when i made this change nothig happens.
I try to use the new actioncolumn in the column definition in this way:
{
xtype:'actioncolumn',
text: "download",
width:80,
items: [{
sortable: false,
align:'center',
iconCls: 'download_icon',
hrefTarget: '_blank',
handler: function(grid, rowIndex, colIndex) {
var rec = reportPanel.getStore().getAt(rowIndex);
return Ext.String.format('<b></b>',rec.id);
}
}]
}
but something is wrong because javascript debugger doesn't made any type of error.
Thanks in advance.
The handler property of actioncolumn (witch renders an icon, or a series of icons in a grid cell, and offers a scoped click handler for each icon) is documented as:
A function called when the icon is clicked.
Consider using the templatecolumn (witch renders a value by processing a Model's data using a configured XTemplate) instead and passing it a tpl property.
Is it possible to have a free text search box on top of a dojo enhancedgrid, which I can type in text and it immediately filter out rows that do not contain the text?
I am aware of the filter plugin and that is not what I prefer.
Thanks so much!
If depends on how you grid view is bind. If it's bind to a ItemFileReadStore you can easily filter it:
store.fetch({ query: { filterCol: filterValue }, onComplete: function completed(items,findResult) {
store = new dojo.data.ItemFileReadStore({ data: { items: items, identifier: 'YourStoreIdentifier'} });}
});
grid.setQuery({name: 'a%'})
will call server on a JsonRest store with query string name=...