If I have a list of (JavaScript) objects in the following form:
var results = [
{'name': 'mary', 'availability' : { 'monday': 'True', 'tuesday': 'False' ... } },
{'name': 'john', 'availability' : { 'monday': 'False', 'tuesday': 'False' ... } },
{'name': 'pete', 'availability' : { 'monday': 'True', 'tuesday': 'True' ... } }
]
how do I display this data in a Webix DataTable, having each of the days in availability as a column?
My configuration object for the DataTable looks like this:
var dtable = webix.ui({
....
view:"datatable",
id: "nameTable",
columns:[
{ id: "name", header:"Name"},
{ id: "availability.monday", header:'Mon'},
{ id: "availability.tuesday", header:'Tue'},
...
],
data:results,
...
});
I have also tried: id: "availability['mon']" which doesn't work or report any error. If I just do : id:"availability", in the browser I see that it shows [object Object] for each row.
I've also tried the autoconfig option but that doesn't render anything (no errors).
I have tried to find examples in the documentation but haven't found any so far. I'm sure this must be possible without having to restructure my incoming data!
There is no native support for complex properties in the Webix DataTable. You can use "template" property of column object to show any property of data object as value of a column, though.
columns:[
{ id: "col1", template:"#availability.monday#"},
Related
I have a a schema that is like product: { ... ,ratings: [ {rating: 3} ] }, and using sequalize, I would like to add on a property product.avg_rating using sequelize.
Here is my code:
sequelize.models.product.findAll({
include: [{
model: sequelize.models.rating,
as: 'ratings',
attributes: {
include: ['rating',[sequelize.fn('AVG', 'ratings.rating'), 'avg_rating']]
},
group: ['rating.rating'],//also tried ratings.rating, and just rating
}],
}).then(products=>{...})
But I keep getting this error:
In aggregated query without GROUP BY, expression #1 of SELECT list
contains nonaggregated column 'text_rewriter.languageCombination.id';
this is incompatible with sql_mode=only_full_group_by
Goal Output:
products: [
{product: 'product name',
...
ratings: [...],
avg_rating: 3.7 //THIS AVG IS WHAT I WANT
},{...}
]
any ideas what I am missing? I have seen many examples, but none of them use include like I did that I found.
sequelize.models.product.findAll({
include: [{
model: sequelize.models.rating,
as: 'ratings',
attributes: ['avg_rating'] //this is column name here
}],
}).then(products=>{...})
This will return :-
products: [
{product: 'product name',
ratings: [...],
rating : { //here all the attributes you wanted, in this case only 'avg_rating' }
},
{...}
]
But you have to define relastionship between products table and rating table before using this.
Table : Product have id, name
Table : Rating have id, rating, product_id
In above case relationship will be 'rating.belongsTo(product) OR product.hasMay(rating)'
MySQL implements detection of functional dependence. If the ONLY_FULL_GROUP_BY SQL mode is enabled (which it is by default), MySQL rejects queries for which the select list, HAVING condition, or ORDER BY list refer to non-aggregated columns that are neither named in the GROUP BY clause nor are functionally dependent on them.
The error is related to sql_mode, you need to execute the following command on your database console.
SET GLOBAL sql_mode = '';
In my Webix datatable one column fetches the data from the DataColletion. The problem is in the column's filtering: seems like it works with the original data (that contains the ID) and ignores the value of the data collection. How can I change this behavior and filter datatable by the collection's value?
Data:
var mycollection = new webix.DataCollection({
data:[{
id: '12',
value: 'CollItem 1'
}]
});
var mydata = [{
id: 1,
name: 'Item 1',
troublesomeColumn: '12' // id of the CollItem 1
}];
Config:
columns:[{
id: 'troublesomeColumn',
collection: mycollection,
header:{
content:"textFilter"
}
}],
data:mydata
Code snippet. Thanks in advance.
Filters work with the dataset, not with the templates or values from the linked collections. Therefore, you need to create a custom filtering rule as described in the Webix Docs, i.e. define the needed pattern in the compareproperty of the filter:
{
content:"textFilter",
compare:function(value, filter, obj){
var colValue = mycollection.getItem(value).value;
toFilter = colValue.toString().toLowerCase();
filter = filter.toString().toLowerCase();
return toFilter.indexOf(filter) !== -1;
}
}
Updated snippet
I need to import the following into a store but I am confused about the correct model or models I need to create.
here is an example of the JSON that is returned from my server. Basically its an array with 2 items, with an array in each. The field names are different in each.
I suspect I need to have more than one model and have a relationship but I am unsure where to start. Any ideas? Thanks
[
firstItems: [
{
name : "ProductA",
key: "XYXZ",
closed: true
},
{
name : "ProductB",
key: "AAA",
closed: false
}
],
secondItems : [
{
desc : "test2",
misc: "3333",
},
{
desc : "test1",
misc: "123"
}
]
]
What you have is not JSON, your opening and ending [] can become JSON by changing them to {} and then using the following models
Then you can model it as
// Abbreviated definitions of Models, it has changed starting at Ext 5
Ext.define('FirstItem', fields: ['name', 'key', 'closed'])
Ext.define('SecondItem', fields: ['desc', 'misc'])
Ext.define('TopLevel', {
hasMany: [
{model: 'FirstItem', name: 'firstItems'},
{model: 'SecondItem', name: 'secondItems'}
]
})
Use the reader for store's proxy, it will create appropriate model on load.
If you need to load already loaded json into the store use loadRawData but reader you will need in any case.
Is there a way in Slick.Grid to render all data to an array so it can be exported?
I am able to get the data from my Slick.Grid instance "mygrid.getData().getItems()" but it is just the raw data not the formated data.
Is there a function I can use to iterate though the collection and return the formated data?
As of now I am having to implement my formatters twice.
Example:
UnixToDate: (row, cell, value, columnDef, dataContext) ->
moment.unix(value).format("MMM Do YY")
items: [
{id: 1, activity_at: 915148798 },
{id: 2, activity_at: 999148800 }
]
columns: [
{field: 'id', id: 'id', name: 'Id'},
{field: 'activity_at', id: 'activity_at', name: 'Activity', formatter: UnixToDate}
]
#data = new Slick.Data.DataView()
#grid = new Slick.Grid( $('#table'), #data, columns )
#data.setItems(items)
I am wondering if there is a way to return the data with the formatted values.
I thought #grid.getData().getItems() would do it but it returns the raw data array.
The data returned should look like:
data: [
{id: 1, activity_at: "Dec 31st 98" },
{id: 2, activity_at: "Aug 29th 01" }
]
I would like the end user to be able to filter and arrange the grid and then export the results in csv format, I have all this working except the formatting part.
Ok I wrote a method to do the export (written in coffeescript and using underscore.js). I also had to expose the getFormatter method in slick.grid.js
getFormattedData: (grid) ->
columns = grid.getColumns()
rows = grid.getData().getItems()
_(rows).map (row) ->
h = {}
i = 0
_(columns).each (column) ->
f = grid.getFormatter(row, column)
h[column.id] = f(row, i, row[column.id], column, row)
i += 1
h
add line to slick.grid.js in the // Public API section
"getFormatter": getFormatter,
When you set autoHeight: true the complete grid is rendered and the html could be exported.
http://mleibman.github.com/SlickGrid/examples/example11-autoheight.html
Answer to updated question:
The formatter is only called when a row is rendered/visible, so an array with the formatted data never exists. At the source: https://github.com/mleibman/SlickGrid/blob/master/slick.grid.js#L1291
I am using a combination of highcharts and knockoutjs to feed data into my chart.
I have 4 massive arrays of data that need to be fed into my highchart upon a click event. I showed the data arrays empty here due to their huge size. Currently it returns an error like: Uncaught TypeError: Cannot read property 'metric' of undefined
My question is how do I access the areas.metric.data and parse it into my chart?
here is my (non) working fiddle:
http://jsfiddle.net/whiteb0x/BG8Qe/18/
function MetricsViewModel(areas) {
var self = this;
self.areas = [ // data structure
{
name: 'Game',
metrics: [{name : 'metric1', id : 'usdeur', data : []}, {name : 'metric2', id : 'msft', data : []}]
},
{
name: 'Player',
metrics: [{name : 'metric1', id : 'msft', data : []}, {name : 'metric2', id : 'msft', data : []}]
},
{
name: 'Social',
metrics: [{name : 'metric1', id : 'googl', data : [] }, {name : 'metric2', id : 'msft', data : []}]
}
];
series: [{ // default series
id: 'adbe',
data: ADBE
}]
}, function(chart){
var data = areas.metric.data; // corresponds to my object above ^^^
self.updateChart = function(metric) {
var id = this.id,
series = chart.get(id);
if(!series){
chart.addSeries({
id: id,
data: data
});
} else {
series.remove();
}
console.log(metric);
}
});
I'm not sure I understand you correctly, but according your code, this function declared in the ViewModel scope:
function(chart){
so you can access access both areas array and you observable metrics array like this:
var data = self.areas[0].metrics;
or observable metrics array like
self.metrics()
in any case, at the line where you have troubles, you are in ViewModel scope and can access whatever you want in it by this or self