jsGrid - get data typed by the user in a search navGrid - d3.js

I'm trying to bind a table and a graph using d3 and jqGrid library. For that I have to get the search typed by the user in the searchbox (my table looks like this : http://www.guriddo.net/demo/guriddojs/)
I've found this function :
grid.getGridParam("postData").filters
but I don't know how to use it. I thought about the trigger event "jqGridToolbarAfterSearch" to get the data after each search but doesn't seems to work...
If someone has an idea I'll be very grateful!
Thanks.
Ps : if the same method exist to set data, I'm interested too.

I hope that I correctly understand your problem. I suppose that you first converts the CSV data of the demo to some more continent data format: array of items with some properties (name, economy, cylinders, displacement, power, weight, mph, year). Then you can use datatype: "local" and data as the input data. I suppose that the user apply the local filter and then you want to get the filtered data
If you use free jqGrid fork of jqGrid (it's the fork which I develop) then you can get lastSelectedData parameter (var filteredData = $grid.jqGrid("getGridParam", "lastSelectedData");) to have the array of filtered items (see the demo). After that you can use d3 with the filtered items.

Related

Data Validation Dropdown With Filtered Data Range

I'd like to use data in column D
For a drop down in another sheet (data validation)
Only items where column A is less than 9
I tried List from a range
But it looks like you cannot put a formula in the range box
e.g.
=FILTER(GrpsTY!D2:D, GrpsTY!A2:A < 9)
Any suggestions?
formulas are not supported in data validation. the best course of action is to create a helper column with your filtered entries and then feed it to data validation.
Maybe they have added the functionality since the most recent answer (last July, 2020)?
I'm trying to figure out a formula that will let me validate data using a filtered list, and stumbled onto this:
This image shows that Google Sheets supports data validation using a custom formula
For Criteria, select "Custom formula is" instead of the default, "List from a range".
Hope this helps anyone who comes after me :)

Extract a column from crossfilter

Heres my problem. I have a working dc.js based dashboard and some data within it. A column of the data contains text data (twitter info). Is it somehow possible to extract that specific column from crossfilter? My aim is to create some charts and the crossfilter containing the text data should feed into a d3 based word cloud so that i can do the drill down based filtering as well which dc and crossfilter provide out of the box. I tried a dimension.top(infinity) but that returns all the key value pairs in the data. I just need the values for a particular key across the whole data set. I hope my question makes some sense.
EDIT:
More research reveals that the wordcloud will accept data in key value pair where the key is the word and value is its frequency of appearance. So i am guessing that will need to be implemented as well. If there is a ready to implement library out there kindly let me know as well. This changes things a bit as far as crossfilter is concerned.I need to throw this calculated key value pair (fit for the word cloud consumption) whenever a filter is triggered. How to go about it?
Looking forward to hearing from you all.
Best,
Anmol
Answer to the first part of the question: Probably dimension.top(Infinity) and then use an accessor to get the values you need. Not exactly efficient, but it is what it is.
Answer to the 2nd part of the question:
You need groupAll, I think. You want to take a tweet, generate an array of tokens (words), then generate a Crossfilter grouping that is a count per word, right? You can code your own custom crossfilter.dimension.groupAll reducers (if you want to do that, create a working example and I can probably cook it up). Or if you want to use Reductio:
tweetWords = data.dimension(function(d) { return d.tweetText.split(' '); });
wordCounts = tweetWords.groupAll();
reducer = reductio()
.groupAll(function(d) {
return d.tweetText.split(' ');
})
.count(true);
reducer(wordCounts);
wordCounts.all();
If you want to filter on this dimension you'll have to override the filter handler and check if the group key is in the dimension array for the record using a filterFunction.

datatables + adding a filter per column

How do I get the search/filter to work per column?
I am making small steps in building, and constantly adding to my data table, which is pretty dynamic at this stage. It basically builds a datatable based on the dat that is fed into it. I have now added the footer to act as a search/filter, but unfortunately this is where I have become stuck. I cannot get the filer part to work. Advice greatly appreciated.
here is my sample data tables that I am working on http://live.datatables.net/qociwesi/2/edit
It basically has dTableControl object that builds by table.
To build my table I need to call loadDataFromSocket which does the following:
//then I have this function for loading my data and creating my tables
//file is an array of objects
//formatFunc is a function that formats the data in the data table, and is stored in options for passing to the dTableControl for formatting the datatable - not using this in this example
//ch gets the keys from file[0] which will be the channel headers
//then I add the headers
//then I add the footers
//then I create the table
//then i build the rows using the correct values from file
//then I draw and this then draws all the row that were built
//now the tricky part of applying the search to each columns
So i have got this far but the search per column is not working. How do I get the search/filter to wrok per column?
Note this is a very basic working example that I have been working off: http://jsfiddle.net/HattrickNZ/t12w3a65/
You should use t1.oTable to access DataTables API, see updated example for demonstration.
Please compare your code with jsFiddle in your question, notice its simplicity and consider rewriting your code.

Date Ranges in jqGrid Searches

We are using advanced search in the latest version of jqGrid, and our search dialog is configured to be always visible on the page above the grid. The structure of our data lists is dynamic. Thus, when we are going to display a list, we first do an ajax call to get the list of columns for the grid. We then construct the data model for the grid and make a request for the data.
Currently, in the request to get the columns, we return the data type of the column. If the data is a date, we display a date picker in the search form. However, some of our customers HATE having to use <= >= for date ranges. They want to be able to pick a date column and then set a start and end date using two side-by-side date pickers. I've been pushing them off for a while now because they have the ability to do date range searches, but the complaining isn't stopping. (It's more clicks to add the second filter with the end date)
Is there any way I can modify jqGrid to give me a date range control when I am configuring a search on a date column? I really don't want to have to set up an external search dialog UI just to deal with these complaints, but product-management is pushing really hard to get "normal" date ranges for the grids.
You can create your own custom search dialog. See this question which I asked couple days ago.
using setGridParam to change your postData array and include extra values in the filters JSON object that will be carried over to your server side where you can dissect it. In your case you can pass over your data range Start and End inside the filter item of the postData. Then reload your jqGrid like this
var $grid = $("#list');
//$grid.setGridParam({datatype:'json', page:1}).trigger('reloadGrid');
var post_data = {searchField:'',searchString:'', searchOper:'',
filters:'{"groupOp":"OR","rules":['+
'{"field":"Date","op":"ge","data":"2012-04-23"},'+
'{"field":"Date","op":"lt","data":"2012-04-25"}' +
']}'
};
$grid.setGridParam({postData:post_data}).trigger('reloadGrid');
The above will save the postData array with the new config and the reloadGrid sends a request to the server with the new postData array. This will preserve the paging as well; however, to get the old view of your grid (without search terms) you need to implement the reset button separately too and trigger reloadGrid after that for this to take effect.
Not sure if you have solved your problem by now; however, I am putting this solution here for any one from the future who has the same issue.
As far I know there is no way to do this, but to write it yourself.
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:custom_searching
Filter jqGrid Data by Date Range?

access list of filtered items in dataview

I'm using a DataView to populate the Grid, and using filters to interact with the visible rows. My problem is after applying the filters, on rows change, or rows count change... how can I access the dataview to iterate over only those visible rows, to do some calculations for example?
Because rows themselves are not publicly exposed... and if they were, a row is not always a data element, since can also refer to a Group, right?
Is there an easy way to access those filtered data elements then?
(I guess what I'm looking for is something like being able to access "var filteredItems = getFilteredAndPagedItems(_items, _filter);")
thanks,
Use dataView.getLength() and dataView.getItem(index) to access filtered/paged/grouped data.
This is the interface the grid is using to talk to the data source.
I posted a solution here if you want to give that a look. Also for those who might be looking for something similar.
Get Filtered data from Dataview in Slickgrid
if you want to show the information that's being filtered and whats on the current page you can do something like this.
var pagingInfo = dataView.getPagingInfo();
var start = pagingInfo['pageSize'] * (pagingInfo['pageNum']);
var filteredAndPagedItems = dataView.getFilteredItems().slice(start,(start + pagingInfo['pageSize']));
console.table(filteredAndPagedItems);
something along those lines.the getFilteredItems is a custom function i added to the dataview.js. for more information view the link.

Resources