I am using AngularUI grid with AngularJS 1.x.
I performed a sort on my table.
Selected all the rows, post sorting.
getSelectedRows() returns the selected data in the original order, but not in the sorted order.
How can I get the selected data in the sorted order?
So, we can get our hands on the sorted data, even with pagination using the below.
var sorted = grid.sortByColumn(grid.rows);
Worked like a charm for the fix I wanted.
Related
I'm using react-table with structured data and a default sort using the 'sorted' prop and my custom sort only sorts in the ascending direction.
Please see a demo of this issue here: https://codesandbox.io/embed/react-table-default-sorting-vxe3e
Note that this is different from the more basic demos as the data is structured such that multiple data points can be displayed in each cell. Here I put the 'firstName' and 'lastName' data points inside another object called 'name' so they could conceivably both be displayed in the same cell.
How can I get my custom sort to work in both the ascending and descending directions
It turns out using the 'sorted' prop is not the proper approach here. I changed this to 'defaultSorted' and it started working in both directions.
I am using Angular UI Grid with Angular 1.x.
Is there a way to fetch the sorted table data after the column is sorted.
I understood that Angular UI Grid does sorting on a temp data (copy of original data), but is there a way to fetch this sorted data from the table.
Have you tried this:
$scope.gridApi.core.getVisibleRows()
Or you can use more precisely:
$scope.gridApi.core.getVisibleRows($scope.gridApi.grid);
This will give array of rows in grid (with current sort condition)
I can't find a way to get all the sorted row data in ui-grid when using pagination
$scope.gridApi.core.getVisibleRows() only shows what is visible on the page I am on
$scope.gridApi.grid.rows contains the original data unsorted
Is there anyway to access all the sorted data? I need to display parts of it elsewhere on the page in the exact same sorted state. Thanks.
I couldn't find anyway to access this data, but I found it could be generated by calling their sort method:
var sorted = grid.sortByColumn(grid.rows);
sorted now has the results I want.
I have been implementing the ability to filter a table based on different fields and at first it seemed fairly straight forward, but now things are getting more complex and I want to make sure I am utilizing Angular's Digest cycle effectively.
Right now, when the user first hits a view and the controller gets instantiated, I call the API and GET an array of data from the server. I call this data a dataSet. This is the raw, unfiltered array of data.
Then on the page there are two different ways to filter, a search bar (<input>) and an actual filter menu where the user can toggle different values On/Off and have the table update accordingly in real-time. At first I thought it would be simple enough to place the filter logic inline inside of ng-repeat using a pipe, however this doesn't work with my pagination because the pagination continues to reflect the dataSet and not the filtered data. This led my HTML to look like
<tr ng-repeat="mailbox in model.IndividualMailboxes.filtered | orderBy:model.IndividualMailboxes.ordering.predicate:model.IndividualMailboxes.ordering.reverse | paginate:(model.IndividualMailboxes.currentPage - 1) * model.IndividualMailboxes.resultsPerPage | limitTo:model.IndividualMailboxes.resultsPerPage">
This then led me to creating a second array that I call filtered. I basically filter the dataSet array into this new filtered array. Then my ng-repeat and pagination both use the filtered set. This also forced me to place the actual filter in the controller and use filterFilter(arr, term) to filter the dataSet in 2 stages
function filterIndividualMailboxes() {
var verifiedList = [], searchList = [];
verifiedList = filterFilter($scope.model.IndividualMailboxes.dataSet, { Valid : $scope.model.IndividualMailboxes.showVerified });
searchList = filterFilter(verifiedList, $scope.model.IndividualMailboxes.search);
$scope.model.IndividualMailboxes.filtered = searchList;
}
The above function simply filters the dataSet by our filtering options (there is only 1 in this case) and then takes that set and filters it based on the search term that the user can input.
The problem with this implementation is it doesn't seem to fit into the digest cycle efficiently as I am having to call filterIndividualMailboxes() whenever the data is changed in any way. The easiest way to implement that was to just $watch() the entire model like this
$scope.$watch('model.IndividualMailboxes', function(){
filterIndividualMailboxes();
}, true);
But I am afraid that this isn't very efficient and not the most fluid way to deal with filtering in Angular.
Does anyone know of a more "Angular" way of doing this that fits right into the digest cycle?
The Extjs Itemselector component has methods like getValue, getSubmitData, getSubmitValue which will return the keys of the records that are selected.
I am looking for a better way than taking the keys of the records selected from the component and fetching for the record from the store by searching the store in a sequential fashion. This is a very time expensive solution which is not working well for me since the itemselector has a large number of records.
Question : is there a way to retrieve the displayed string/value (in the selected part of the itemselector) along with the keys directly from the component and not as above ?
thanks
Nohsib
This works in my code to get an array of all the records which you can then get the values from, it may not work in yours if you have a different version of Extjs:
itemSelectorField.toField.store.getRange();
Oh and if you want the display values as a string list:
itemSelectorField.toField.store.getRange().collect("display_value_propery_name").join(",");