Utilizing the solution provided by Gordon, I've successfully created a selectable table that contains aggregated data. Now I would like to filter the data with the text-filter-widget.
I understand that the filter needs an array to work properly. What I am trying to understand is how might one be able to update the table rows when the table filters are looking at a group?
A text filter widget is different from a chart in that it takes a dimension to filter on.
We also need to declare a second market dimension so that it will filter the table.
Thus
var marketDim, marketDim2;
// ...
marketDim = facts.dimension(function(d) {
return d.Location;
});
marketDim2 = facts.dimension(function(d) {
return d.Location;
});
// ...
search
.dimension(marketDim2);
Fork of your fiddle.
Related
I have a data table that has a hidden column. I want to set the values of that column to a java script array. (Note: I want to get the values that belong to the current page only). If I use a search filter, I want the values of the current page of the search result.
I've tried like this.
$('#datatbl').DataTable().rows({filter: 'applied'}).every(function () {
var row = this.data();
arr.push(row[0]);
});
But,this code gives all values from all the pages. Please help....
Try adding page:'current' in selector.
$('#datatbl').DataTable().rows({filter: 'applied', page:'current'})
I have a table component in my Pentaho CDE dashboard and data source is sql. I want to make a table like this
enter image description here
I need to add a column as row names for this table and a row on the top of column header.
I found a method here:
Table Component SubColumns
to add header, but how can i add a column before other columns?
I think a clever way to do the extra column part would be by modifying the query result object after it's retrieved from the query, so that you add the columns and rows as needed. You can do this in the PostFetch callback function, which takes the query result object as first argument:
function yourTableComponentPostFetch(queryResult) {
// Let's say you have an array of row names
var rowNames = ['Title1', 'Title2', ... ];
// Add a "title" column for every row
queryResult.resultset.forEach(function (row, idx) {
// Push it at the beginning of the row array
row.unshift(rowNames[idx]);
});
// Change metadata description of columns to reflect this new structure
queryResult.metadata.unshift({
colName: 'Title',
colIndex: -1, // this makes sense when reindexing columns below ;)
colType: 'String'
});
// One last re-indexing of metadata column descriptions
queryResult.metadata.forEach(function (column, idx) {
// The title added column will be 0, and the rest will rearrange
column.colIndex++;
});
}
The only tricky part is the part about modifying the metadata since you are effectively changing the structure of the dataset, and making sure the queryResult object is updated in-place instead of just changing its reference (queryResult = myNewQueryResult would not work), but the code I proposed should do the trick.
I have created a jqGrid - Pivot table JSFiddle example: here.
In this It should not print the line if Component Type value is blank, I Used this empty column, to show all periods(months) in the year, which is mandatory.
Need help in removing that blank line. and also is it possible to remove the last sum column 2015 from grid, if so how?
You includes dummy data with ComponentType:"" group which you don't want to display. So the best solution which I see would be to include the data in the input pivot data only, but don't use the dummy data in the grid data. jqPivot uses datatype: "jsonstring" to prevent additional sorting of previously sorted data. The input data will be placed as the value of datastr option. So one can use the following onInitGrid to remove the dummy data before the data will be processed by jqGrid:
onInitGrid: function () {
var p = $(this).jqGrid("getGridParam"),
userdata = p.datastr.userdata;
p.datastr = $.grep(p.datastr, function (item) {
return item.ComponentType !== "";
});
p.datastr.userdata = userdata;
}
see the modified demo http://jsfiddle.net/OlegKi/b47ocLd7/11/.
In our RethinkDB database, we have a table for orders, and a separate table that stores all the order items. Each entry in the OrderItems table has the orderId of the corresponding order.
I want to write a query that gets all SHIPPED order items (just the items from the OrderItems table ... I don't want the whole order). But whether the order is "shipped" is stored in the Order table.
So, is it possible to write a query that filters the OrderItems table based on the "shipped" value for the corresponding order in the Orders table?
If you're wondering, we're using the JS version of Rethinkdb.
UPDATE:
OK, I figured it out on my own! Here is my solution. I'm not positive that it is the best way (and certainly isn't super efficient), so if anyone else has ideas I'd still love to hear them.
I did it by running a .merge() to create a new field based on the Order table, then did a filter based on that value.
A semi-generalized query with filter from another table for my problem looks like this:
r.table('orderItems')
.merge(function(orderItem){
return {
orderShipped: r.table('orders').get(orderItem('orderId')).pluck('shipped') // I am plucking just the "shipped" value, since I don't want the entire order
}
})
.filter(function(orderItem){
return orderItem('orderShipped')('shipped').gt(0) // Filtering based on that new "shipped" value
})
it will be much easier.
r.table('orderItems').filter(function(orderItem){
return r.table('orders').get(orderItem('orderId'))('shipped').default(0).gt(0)
})
And it should be better to avoid result NULL, add '.default(0)'
It's probably better to create proper index before any finding. Without index, you cannot find document in a table with more than 100,000 element.
Also, filter is limit for only primary index.
A propery way is to using getAll and map
First, create index:
r.table("orderItems").indexCreate("orderId")
r.table("orders").indexCreate("shipStatus", r.row("shipped").default(0).gt(0))
With that index, we can find all of shipper order
r.table("orders").getAll(true, {index: "shipStatus"})
Now, we will use concatMap to transform the order into its equivalent orderItem
r.table("orders")
.getAll(true, {index: "shipStatus"})
.concatMap(function(order) {
return r.table("orderItems").getAll(order("id"), {index: "orderId"}).coerceTo("array")
})
On my grid, after a user enters text on the bottom row, I am adding another row so they can fill out another row if needed. The grid will grow as needed by the user. This is working fine, however after a page reload and populating from db, the addrowdata() function does not honor existing row ids and creates duplicates, starting from 1 again, e.g. jqg1. It should look at existing row ids and create new unique ids. So if I have 5 rows already, it might start at jqg6. Here is the relevant code inside onCellSelect:
var records = jQuery("#table-1").jqGrid('getGridParam', 'records');
var lastRowId = jQuery("#table-1").jqGrid('getDataIDs')[records - 1];
if (lastRowId == id)
{
jQuery('#table-1').addRowData(undefined, {}, 'last');
}
I have also tried $.jgrid.randId() instead of undefined, same results as expected.
Thanks
Ryan
I think that the error is in the part where you fill grid with the data from the database. The data saved in the database has unique ids. The ids are not in the form jqg1, jqg2, ... So if should be no conflicts. You should just fill the id fields of the JSON with the ids from the database.
One more possibility is that you just specify the rowid parameter (the first parameter) of addRowData yourself. In the case you will have full control on the new ids of the rows added in the grid.
The code of $.jgrid.randId function is very easy. There are $.jgrid.uidPref initialized as 'jqg' and $.jgrid.guid initialized to 1. The $.jgrid.randId function do the following
$.jgrid.randId = function (prefix) {
return (prefix? prefix: $.jgrid.uidPref) + ($.jgrid.guid++);
}
If it is really required you can increase (but not decrease) the $.jgrid.guid value without any negative side effects.