Forums Home / Wijmo / General Discussion
Posted by: chandrasekar_keerthana on 20 March 2020, 7:32 am EST
chandrasekar_keerthana
Posted 20 March 2020, 7:32 am EST
Hi Team,
We are using Wijmo flexsheet with observableArray as the itemsource for the sheet. On sorting the sheet, we observe that the itemsSource of the sheet isn’t getting updated with the new order of rows. This is causing trouble as we try to update few values from the code and save the records.
Please let me know if there’s a way to obtain the sorted dataset from the sheet.
Thanks,
Keerthana
ashwin.saxena
Posted 23 March 2020, 1:54 am EST
Hi Keerthana,
When we sort a FlexSheet, the actual data is not sorted. It remains in the same position. The sorted data (and filtered data) is stored in the items property of the CollectionView. Please refer to the sample below for reference:
https://stackblitz.com/edit/angular-epjccf
Regards,
Ashwin
chandrasekar_keerthana
Posted 23 March 2020, 8:29 am EST
Thanks for your response Ashwin. That’s exactly what I was looking for.
chandrasekar_keerthana
Posted 29 April 2020, 1:45 pm EST
Hi Ashwin,
After placing the above code fix, I’m getting other issues like after applying the column filter, if I try to sort the filtered data, filter will go off and sort will be applied to entire data.
joc_sheet.filter.filterChanging.addHandler((s, e) => {
var editor = s.activeEditor;
editor.buttonClicked.addHandler(editor => {
var btn = wijmo.getActiveElement();
var btnType = btn.getAttribute(‘wj-part’);
if (btnType === “btn-asc” || btnType === “btn-dsc”) {
joc_sheet.sheets[0].itemsSource = new wijmo.collections.ObservableArray(joc_sheet.collectionView.items);
vm.set(“joc_sheet_data”, joc_sheet.sheets[0].itemsSource);
}
})
});
joc_sheet.filter.filterChanged.addHandler(function (s, e) {
if (vm.get(‘is_frozen’) == ‘Y’) {
me.formatFrozenSheet(joc_sheet, jocRange);
}
else
me.formatSheet(joc_sheet);
});
And if I try with below code, Column filter is not working.
joc_sheet.filter.filterChanging.addHandler((s, e) => {
joc_sheet.sheets[0].itemsSource = new wijmo.collections.ObservableArray(joc_sheet.collectionView.items);
vm.set(“joc_sheet_data”, joc_sheet.sheets[0].itemsSource);
}); joc_sheet.filter.filterChanged.addHandler(function (s, e) { if (vm.get('is_frozen') == 'Y') { me.formatFrozenSheet(joc_sheet, jocRange); } else me.formatSheet(joc_sheet); });
And if I not use these filterChanging events, then once if I apply the sort and change the value of any rows data, that value will be updated in another row where it was present in the same row position before the sort.
For example, 1st row is came to 5th row position after the sort. Then if I update the sorted 1st row, then 5th row(it was in 1st row position before the sort) data is also gets updated.
Can I get any solution for these issues.
Thanks and Regards,
Keerthana
ashwin.saxena
Posted 30 April 2020, 12:43 am EST
Hi Keerthana,
If the value is updated in another row after sorting, then it may be a bug. Can you let me know whether this issue appears with simple data? Also, can you let me know the version of Wijmo which you are currently using so I can try to replicate the issue?
~regards
chandrasekar_keerthana
Posted 30 April 2020, 9:20 am EST
Hi Ashwin,
I’m using wijmo-5.20192.631 Version. And this issue is not appearing with simple data and also if I use the below code, it was not updating the row which was present in the current row position before the sort.
If I use this below code, then after some column filter is applied to the Flexsheet if I sort the column data, then applied filter will go off. But if I apply the sort first then apply the filter, then there won’t be any issue.
I could observe that filtered data is not getting stored in the items property of the CollectionView because there is a condition I have placed in the filterChanging event.
joc_sheet.filter.filterChanging.addHandler((s, e) => {
var editor = s.activeEditor;
editor.buttonClicked.addHandler(editor => {
var btn = wijmo.getActiveElement();
var btnType = btn.getAttribute(‘wj-part’);
if (btnType === “btn-asc” || btnType === “btn-dsc”) {
joc_sheet.sheets[0].itemsSource = new wijmo.collections.ObservableArray(joc_sheet.collectionView.items);
vm.set(“joc_sheet_data”, joc_sheet.sheets[0].itemsSource);
}
})
});
joc_sheet.filter.filterChanged.addHandler(function (s, e) {
if (vm.get(‘is_frozen’) == ‘Y’) {
me.formatFrozenSheet(joc_sheet, jocRange);
}
else
me.formatSheet(joc_sheet);
});
If I remove the condition, like
joc_sheet.filter.filterChanging.addHandler((s, e) => {
joc_sheet.sheets[0].itemsSource = new wijmo.collections.ObservableArray(joc_sheet.collectionView.items);
vm.set(“joc_sheet_data”, joc_sheet.sheets[0].itemsSource);
});
then column filter will not work.
Can I get to know how to store the filtered data and apply the sort for same filtered data? Which event will be called when the filter is applied and from where I can get the filtered data ?
Thanks and Regards,
Keerthana
ashwin.saxena
Posted 1 May 2020, 1:20 am EST
Hi Keerthana,
The filterApplied event can be used in your case. Whenever the filter is applied or cleared, this event is raised. The filtered items is also stored in the items property of the CollectionView as I said earlier.
~regards
chandrasekar_keerthana
Posted 4 May 2020, 1:04 pm EST
Hi Ashwin,
As I see, only sorted data will be stored in the items property of the CollectionView. Filtered data not able to find in CollectionView’s items.
For example, 10 rows are loaded into a flexgrid. Once I apply the sort, all 10 rows will be present with new position in CollectionView’s items. If I apply the filter, I can see 3 rows in the grid and others rows are hidden. But still collectionView’s items contains all 10 rows including hidden rows.
Can I get any solution to get only visible rows in items property of the collectionView when I apply the filter.
Thanks and Regards,
Bhavya
ashwin.saxena
Posted 5 May 2020, 1:07 am EST
Hi Bhavya,
Sorry for the mistake. It seems that the FlexSheet only hides the rows and does not actually filters out the data. That is why, the items property contains all the items.
You may get the filtered items by iterating over all the visible rows and getting their dataItems:
https://stackblitz.com/edit/angular-yevefz
~regards
chandrasekar_keerthana
Posted 6 May 2020, 6:36 am EST
Hi Ashwin,
Yes, I could able to get the filtered data by iteration through the visible rows.
Thanks for the solution. I works fine now.
joc_sheet.filter.filterChanging.addHandler((s, e) => {
var editor = s.activeEditor;
editor.buttonClicked.addHandler(editor => {
var btn = wijmo.getActiveElement();
var btnType = btn.getAttribute(‘wj-part’);
var collectionData = new wijmo.collections.ObservableArray(joc_sheet.collectionView.items);
var visibleData = me.getCurrentData(joc_sheet);
var filteredData = ;
if (btnType === "btn-asc" || btnType === "btn-dsc") { if (collectionData.length == visibleData.length) { filteredData = collectionData; } else { filteredData = visibleData; } } else if (btnType === "btn-clear") { filteredData = joc_sheet.sheets[0].itemsSource; } vm.set("joc_sheet_data", filteredData); }) });
getCurrentData: function (flex) {
var data = ;
flex.rows.forEach(function (row) {
if (row.isVisible && row.dataItem) {
data.push(row.dataItem);
}
});
return data;
}
Thanks and Regards,
Bhavya
