Releases: ghiscoding/Angular-Slickgrid
Frozen Columns and SlickGrid/DataView interfaces
Quick Word
I would like to remind everyone that this lib is mostly done by 1 person (myself @ghiscoding) and I would seriously prefer if you have any coding questions to ask them on Stack Overflow since a lot more users can help you out with any simple installation or usage questions. You might have also notice that I've installed a Bot that will auto-close any issues that are missing the REQUIRED
sections from the issue templates (I've installed that because I got tired of having to repeat the same questions over and over, if you want help then please take the time to fill in your issue form accordingly, 30sec of your time to fill in the issue template with all info goes a long way)... but again I would prefer any questions be asked on Stack Overflow
New Features
This new version brings a couple of new features, the 2 main ones are explained below:
- SlickGrid interface and SlickDataView interface, this is great with VSCode intellisense.
- these are NOT linked anywhere in the lib (it will be in next
major
version, continue reading below) because that would have probably thrown a lot of TS build compiling warnings/errors but you can start using them wherever you find them useful, so you can change all your code fromany
type to the following:
- these are NOT linked anywhere in the lib (it will be in next
import { SlickGrid, SlickDataView, } from 'angular-slickgrid';
export class MyComponent {
grid: SlickGrid;
dataView: SlickDataView;
}
- a new "Frozen Columns" header menu (this is an opt-in feature) - demo animated gif | Example 15 (bottom grid only)
- in order to see this new header menu command, you will have to use the following code since it's an opt-in feature, also note that it will also an extra Grid Menu command "Clear Frozen Columns" to remove all columns freezing (pinning)
this.gridOptions {
`gridMenu: { hideClearFrozenColumnsCommand: false },
headerMenu: { hideFreezeColumnsCommand: false }`
}
What's coming in the Future (much later in the year)
This version is probably the last minor
(features) version before a major
(breaking changes) version. The next major version, which by the way is a very loose roadmap date (maybe before Christmas would be nice). What will this next major version be all about?
- It will use another lib Slickgrid-Universal with all the common code
- it is a Monorepo structure (built with Lerna) and by the way Angular is a monorepo structure
- It's fully typed, so it has all necessary TypeScripts interfaces (including the 2 new
SlickGrid
andSlickDataView
that were mentioned earlier) - All
@deprecated
code will be removed- to prepare yourself, you might want to look at your console, most of the deprecated code already send
console.warning
messages
- to prepare yourself, you might want to look at your console, most of the deprecated code already send
- It will be framework agnostic (can be used by Angular-Slickgrid, Aurelia-Slickgrid, SalesForce, ...)
- It will have a few decoupled Services as separate packages (OData, GraphQL, FileExport & ExcelExport)
- You can see an example of the changes here
- this also mean smaller bundle size for you (currently these 4 Services are in Angular-Slickgrid, want it or not)
- Any work done for this new breaking version will go under the new
version-next
branch
So the main points are number 1 & 5, the latter being the main breaking change, this new lib was built because I already support 2 frameworks (Angular & Aurelia) and now we are starting to use it in SalesForce, that is yet a 3rd framework (SalesForce uses plain ES6 JS). I thought this would be a great opportunity to move all of the common code (which Angular-Slickgrid & Aurelia-Slickgrid share about 80% of the same code) into 1 single lib (a common lib written in TypeScript but is framework agnostic) which could later be used in any frameworks (Angular-Slickgrid, Aurelia-Slickgrid, ... maybe other frameworks in the future, who knows) or in plain TypeScript or ES6.
All that to say, the focus is now on Slickgrid-Universal, once that is all complete then the work would be to rewrite Angular-Slickgrid by dropping all the common code (the 80% code) and instead use the code from common lib (Slickgrid-Universal). At the end of it, when everything is done, it will be only 1 place to update common code (instead of always having to update both Angular & Aurelia libs with most often the exact same piece of code). At the end of the day, Angular-Slickgrid
will use Slickgrid-Universal
which itself will use SlickGrid
core lib, and anything related to Angular will remain in Angular-Slickgrid but anything else (common shared code) will be coming from Slickgrid-Universal
, for the most part most users won't notice any differences except for the decoupled Services (OData, GraphQL, FileExport & ExcelExport) where you'll have to reference the new lib directly for example @slickgrid-universal/excel-export
, you can see an example of the usage for Export Services and Backend Services in the upcoming Migration Guide.
More info can be found on the Slickgrid-Universal GitHub page.
Final Word
If you like the lib, please upvote ⭐ and/or Buy Me a Coffee ☕
Features
- editor: use better error message for inclusive values (#499) (6f7b569)
- pinning: add "Frozen Columns" to header menu (#494) (7782ad3)
- sorting: header menu clear sort, reset sorting when nothing left (#509) (5898c18)
- typing: add SlickGrid and DataView interfaces (#483) (2cee037)
- typings: add more TS Generic Types (#489) (a379837)
- badge: add Cypress badge (7c6c8e1)
- core: use DataView transactions with multiple item changes (#527) (154bfb1)
- styling: add custom footer font-size SASS variable (#519) (bc56030)
- tests: add more Cypress E2E tests for grid with Editors (#532) (701b624)
- tests: add more Cypress E2E tests for Tree Data (#525) (36f958d)
Bug Fixes
- core: add missing use of custom datasetIdPropertyName (#476) (9be8fbf)
- editor: float validator should accept decimal even without 0 suffix (#510) (04b4465)
- editor: shouldn't call cell changed when cell value is undefined (211a2b9)
- editor: shouldn't call cell changed when cell value is undefined (#516) (0aaeb02)
- example: use highest id as new id in addItem example, fixes #495 (#497) (1550d9d)
- excel: Excel Export add mime type to work in Firefox, fixes #500 (#501) ([56c8e17](https://...
Tree Data View & new Styling Themes with SVG icons
Quick intro
This version is packed with a new major feature (Tree Data View) and also comes with many styling enhancements & bug fixes. There's also a new Dual Input Editor.
Tree Data View
This is the biggest feature in this release, it is a fairly complex feature to implement (because it requires lot of recursion handling) and because of that it comes with some limitation (see below). There are 2 demos which represents 2 ways of building a grid with Tree Data.
- Tree Data from Parent/Child refs - demo | component
- Tree Data from Hierarchical dataset - demo | component
Tree Data Limitations
Tree Data is, like I said earlier, fairly complex and because of that, it has certain limitations. See below for what works and what doesn't. If anyone can help in pushing the missing piece further that would be great.
Works
- Single Column Sort
Doesn't Work (they're also not supported, so please don't open any new issue unless you want to help)
- Multi-Column Sort
- Aggregator
Styling
There is now a new Sort Icon hint (with an opacity of 0.5) when hovering a Column that has Sort enabled, this will help the user to identify that the column is sortable.
New Themes
This release also brings 2 new Styling Theme, first is a Material Design Theme and also a Salesforce Theme... does that mean SlickGrid is used in Salesforce... indeed! (more on that later).
For more demo, you can also take a look at my other repo (Slickgrid-Universal) demos. Also, note that Bootstrap is completely optional (and has been for some time), the other demo that I mentioned was created using only the Bulma CSS framework, you will also notice that only the Material & Salesforce Themes were used across these multiple examples.
Each of these Styling Themes are compiled in CSS and created from a SASS file, so you can use either or. Both Themes are shown in each Tree Data demo
- Note: you might need to refresh the page to see the theme correctly since the styling is global and if you change page, the style will follow on the next page (unless you refresh).
SVG Icons
The 2 new Themes were created with only SVG icons, most of the icons were pulled from the Material Design Icons set. If you wish to create your own set of SVG Icons, you can refer to the new Wiki - SVG Icons
Note: Just to point out that both the Fonts and SVG icons are supported, the default Bootstrap theme will keep Font-Awesome 4 so that it still works for everyone. You could however use SASS to override the Font and use SVG, again see the Wiki - SVG Icons for more details.
Final Word
If you like the lib, please upvote ⭐ and/or Buy Me a Coffee ☕
Features
- editor: add new Dual Input Editor & extract all Editor Validators (#446) (06f5dc9)
- extension: add column position option for checkbox row selector (fc72ba0)
- extension: add column position option for Row Detail icon (#419) (36bdcd1)
- extension: add latest slickgrid with RowMove improvements (#428) (4f4b231), closes #256
- grouping: add missing Grouping interface properties, closes #430 (#432) (fe7a65a)
- query: add queryFieldNameGetterFn callback know which field to use (#434) (0d5a150)
- sort: add valueCouldBeUndefined column flag to help sorting (#429) (dcd7a41)
- style: add Sort icon hint on hover when column is sortable (#435) (a746c2d)
- styling: add CSS/SASS Material Design & Salesforce styling themes (#454) (0030763)
- translate: add namespace prefix + separator grid option (#462) (c23370e)
- treeData: add new Tree Data View feature, closes #178 (#455) (3250bde)
- gridMenu: update SlickGrid & add new Grid Menu options, fixes #464 (#473) (10f0b7d)
Bug Fixes
- editor: disregard Flatpickr error on Date Editor and fix output format (#445) (96e2973)
- export: add grouped header title (from pre-header) into exports (#436) (a315f85)
- export: remove unsupported file type, closes #452 (#458) (c00b6ab)
- filter: string filter should also work when using Contains (#427) (2c0765b)
- filter: when entering filter operator it shouldn't do any filtering (#431) (9d53315)
- formatter: exportWithFormatter should work with undefined item prop (#457) (3cfcab1)
- gridMenu: column picker list should include grouped header titles (#460) (e4a34a0)
- gridMenu: command "Togge Filter" disappeared, fixes #438 (#448) (b10c5be)
- gridService: crud methods should support custom dataset id (#453) (2c91f35)
- pagination: passing custom pagination sizes should work, fixes #456 (#459) (0367625)
- resizer: remove scrollbar measure compensate patch (#424) (bca1f0b)
- rowDetail: use latest SlickGrid to fix issue with id, fixes #440 ([#449](https://github.com/ghi...
Row Selection now in Grid State & Presets
Row Selections in Grid State & Presets
Row Selections are now included in the Grid State & Presets, I didn't want to include them in the past mainly because I always thought that it wasn't keeping the selection properly after filtering/sorting/... but then I learned about syncGridSelection
and how it works. This flag allows to actually keep in memory the row selection, even when row is not visible... with this, it's now part of the Grid State & Presets and it even works with Local Grid Pagination (that required a lot of work though). The syncGridSelection
is still a flag that that can be disabled in the Grid Options if you wish to not preserve the hidden selections. You can see Example 10 - Row Selections and Example 16 - Grid State
Note when using BackendServiceApi
However please note that even if syncGridSelection
is enabled by default, it is disabled when using a BackendServiceApi it is disabled with an extra flag syncGridSelectionWithBackendService
, you could enable it if you want but you might have unintended behaviors because Backend Services changes the DataView every single time there's a page change.
Again if you like the lib, please upvote if you haven't yet. ⭐️
Cheers ☕️
Features
- menus: add "onAfterMenuShow" event to all possible menu plugins (#389) (141d01a)
- selection: add flag to disable syncGridSelection w/BackendService (#390) (f29c6f0)
- selection: preserve row selection & add it to Grid State & Presets (#388) (a50d489), closes #295
- excel: add some extra styling & width options for Excel export (#403) (d87ce2c)
- tests: update to latest Cypress version (dc3afa9)
- sort: add default sort field as grid option (00b0751)
Fixes
- rowDetail: add datasetIdPropertyName option in Row Detail, (#391) (197ea9f), fixes #387
- backend: updateOptions can be use with partial options - TS type (80bdaa5)
- footer: custom footer should work anytime pagination is disabled (7d9798a)
- locales: fix some Locales not showing up when not using Translate (#392) (4d5e65b)
- pagination: on filter change pagination should reset to 1st page (#397) (af64dd6)
- selection: filter data should work with row selection, closes #295 (#393) (f36a4f7)
- selection: row selection always be kept, closes #295 again (#399) (5e8f1df)
- editor: LongText Editor save button that was not working properly (90beeac)
- mousewheel: add jquery mousewheel lib to fix scroll in frozen grid (d2bc0e7)
- columns: add/remove columns dynamically, fixes #406 (324cb1a)
- example: should re-render after clearing groups, fixes #407 (7752abd)
- columns: remove columns dynamically with Editors, fixes #406 (903473d)
- formatters: decimalSeparator & thousandSeparator work tgt, fix #411 (67318d5)
Local Grid Pagination & Backend Service new features
Local Grid Pagination
This was requested couple times, it's now possible to show Pagination on a local grid (that is without using a backendServiceApi
). To get this to show up, the only thing you need to do is to enablePagination: true
define the Pagination settings in your Grid Options. You can see demo of this new feature
Custom Footer (opt-in feature)
In addition to the Local Pagination, there is also a new Custom Footer that was just created and can be used to display some of the grid metrics (items count, with/without filter, last update timestamp and some more). However note that since this footer display roughly the same info as the Pagination, it cannot be displayed when a Pagination is already shown (in other words, it only works when Pagination is disabled). It's also very customizable, you can choose to display/hide some of the metrics. You can see demo of this
- demo Example 2 / Example 4 and Example 12 for the full metric options shown.
Row Detail
From a Stack Overflow Question it was brought to light that it was very hard to get access to the SlickGrid, DataView objects and even Parent Component references from the Row Detail Child Component. This was addressed in this new version
- The Row Detail Example was modified to show a demo how to delete the grid row directly from the Child Component. You can also see docs in the updated Wiki
Backend Services (new features/interfaces for OData & GraphQL)
These changes apply to both available Backend Services (OData, GraphQL) and it was started in previous version but improved in this version. You can now disable the Pagination and expect the backend query to be different (that is without any pagination offset and stuff in the query). There also 2 new interfaces OdataServiceApi
and GraphqlServiceApi
interfaces to help with TS Types and use the correct properties associated to each. The most interesting change is probably that you can now use OData/GraphQL to load the data once but then use local Filtering/Sorting (without calling the backend) with these 2 new flags useLocalFiltering
and useLocalSorting
(they can be used separately too), a new GraphQL Example was created to demo that feature (we demoed with GraphQL but it also works with OData).
- new GraphQL Example to demo the use of local filtering/sorting
Important Code Change (when using TranslateService
)
Please note that the Column Definitions property headerKey
will be deprecated (in the future) and replaced by nameKey
so that it align with SlickGrid (core) property which is name
, for the column header title name. With this change, every other possible Translation Keys are aligned, in other words, any time you want to use translations, you just need to add the Key
suffix, for example (name
=> nameKey
, label
=> labelKey
, columnGroup
, columnGroupKey
, ...). For now headerKey
still works but you might want to start doing this change earlier than later.
Cheers ⭐️
Features
- backend: add OData & GraphQL Service API interfaces (43d3a00, 11cc71c)
- backend: add option to use local filtering/sorting strategy (73c288b)
- examples: add new GraphQL without Pagination Example (f02ac2d)
- footer: add custom footer to show metrics (2054319)
- pagination: add Pagination to local grid (53aa9dc)
- rowDetail: add few object instances that can be used in child comp (9cc52c3)
- rowDetail: add Parent property to pass ref to parent comp (dd8c1cd)
- tests: add Cypress E2E for Local Pagination and fix new bugs found (b7b1a73)
- columnGroup: add columnGroupKey property in order to use translate (147470f)
Bug Fixes
- backend: cancel prior http calls to avoid inconsistent data shown (f9aaf54)
- build: TS warning on a missing Type (b894ee1)
- cypress: fix failing Cypress E2E test (e78b2d9)
- examples: use spinner only when loading data (d0b4820)
- examples: use valid date format (f66703a)
- filter: creating blank entry should only be entered once (3b769a4)
- filters: remove filter DOM element IDs to avoid duplicate IDs (4b83133)
- header: column header grouping should be re-render after a resize (beda628)
- menu: remove unused code in Context Menu to select cell (a2ae4bb)
- pagination: reload local grid with pagination presests w/same data (80eef1a)
- pagination: should work with page number defined in presets (95428ad)
- resizer: grid size fix for backend service with pagination disabled (6c4bcca)
- styling: add missing SASS variable import (6de44e6)
- styling: fix some styling issues found with menu dividers (6f375c9)
- test: fix failing Cypress E2E test after GraphQL changes (dc50117)
- test: fix Jest failing unit test (761fa4a)
- build: create & use separate excel-builder package to fix security (c114ae0)
- footer: fix Custom Footer styling issues with Bootstrap 4 (658a9fd)
- pagination: should be empty (0) when filtering an empty dataset (7409832)
- backend: fix build warnings (c72ccc9)
- columns: Column Grouping should re-render after cols reordering (bd991f0)
- formatter: refine condition to display a checkmark icon (507b299)
- state: Clear Sort should trigger only 1 event & fix Pagination (8e4f931)
Cell Menu and Context Menu Plugins & GraphQL changes
Happy New Year and New Decade! 🎄🔔
Let's start the year strong, this new release brings 2 new, and extremely useful, plugins (extensions).
Please make sure to upvote ⭐️ if you like the lib. Cheers 😸
Cell Menu & Context Menu
In this new version, I revamped the styling of the Column Picker and Grid Menu (and added a bunch of SASS variables) to align with the Header Menu, there's also a lot more Cypress E2E tests (nearly double). But most importantly this version brings 2 new Extensions, Cell Menu & Context Menu. I created them both at the same time (directly in the SlickGrid core library as plugins before using them in this lib), they are very similar in their look & feel and also on how to use them as well, however they do serve different purposes. The Cell Menu is more related to row actions (e.g. delete current row) while the Context Menu is all about actions for the entire grid (e.g. export to Excel).
The Cell Menu is most commonly used as an Action Menu and triggered by a cell click or touch (you could have 1 or more Cell Menu in a grid). On the other hand, a Context Menu (only 1 per grid and now enabled by default) is triggered by a mouse right+click and comes with a few built-in commands (copy cell, export & some grouping commands when grouping is available). Both of these extensions accept a list of Commands and/or Options, the Commands are of course to execute an action and the Options are more commonly used to change a value of the current row (it can only takes 1 array of Options).
To see it in action
- a new Example 26 to demo both Cell Menu & Context Menu and an animated GIF to demo the feature.
- for a Context Menu with Grouping commands, you can check out Example 14 - Grouping and do a mouse right+click
- Wikis
GraphQL
Includes a small Breaking Change
The GraphQL Service changed slightly so that it can now be used without Pagination (the query will be different). To adapt to this change, the GraphqlResult
interface got renamed to GraphqlPaginatedResult
while the GraphqlResult
interface is now used without page information. This basically mean that you can now disable Pagination (via enablePagination: false
in the grid options) and expect a query without page info and the query will be different according to this flag, for example:
- with Pagination
query{ users(first:20, offset:40){ totalCount, nodes{ id, firstName, lastName }}}
- without Pagination (via
enablePagination: false
)query{ users{ id, firstName, lastName }}
Note that current GraphQL querying inputs for Filtering & Sorting remains the same with/without Pagination, you can refer to the GraphQL Wiki for more info.
Features
- cellMenu: starting adding new CellMenu Extension (5ab64a1)
- github: change issue templates and add auto close bot (90271bf)
- menu: add action & override callbacks to all Menu plugins (a7967bb)
- menu: add Context Menu feature POC (8d04406)
- menu: starting adding new ContextMenu Extension (95d3227)
- styling: change Column Picker & Grid Menu styling (b9dc977)
- styling: change Column Picker & Grid Menu styling (d91086b)
- styling: add more SASS variables to header menu (373641f)
Bug Fixes
- graphql: disable pagination should remove any page info from query (63190c8)
- sort: add sort icons to grouping examples (0bb9844)
- translations: align all Export translations and add missing locales (d3e45bc)
- security: update DOMpurify to fix potential xss vulnerability (63c1ddc)
- styling: use latest SlickGrid version and fix some styling issues (dc0a688)
- build: TS warning on a missing Type (97b25f7)
Update Filters and/or Sorting Dynamically & Full Test Coverage (100%)
Big Annoucement
Huge news, Angular-Slickgrid just reached 100% Test Coverage, around ~8200 lines of code fully tested. 🚀
New Features
This new version brings a feature that was a asked a few times that is to update/change any Filters and/or Sorting dynamically (that is on the fly at any time). It also works with Backend Services (OData & GraphQL). This kind of functionality was already available via Grid Presets but the presets
is restricted to first page load only, while the new features can be called at any time. However please note that it's still preferable to use presets
to effectively preset your grid with any Filters and/or Sorting when loading the grid, the differences is that the presets
happens before the grid is even ready (it will load the grid with them), while updating Filters/Sorting dynamically (the new feature) can only be called after the grid is ready and shown, so there's a big distinction between them.
- Documentation
- Demos
- You can see all of these examples to demo both features Client | OData | GraphQL | Draggable Grouping | Range Filters
Again, if you like the lib and haven't up voted yet, please do so ⭐️ cheers 😸
Features
- filters: provide method to apply grid filters dynamically (8c10e5a)
- sorting: provide method to apply grid sorting dynamically (9a99ca0)
- filters: allow to bypass changed events when calling updateFilters (62c807e)
- sorting: allow to bypass changed events when calling updateSorting (35936ad)
- cypress: add Dynamic Filters feature E2E Cypress tests (043ce89)
- tests: add Jest & Cypress tests for Dynamic Sorting feature (d0fa65e)
- tests: add more unit tests & cleanup some code (644e1dc)
- tests: add missing unit tests to have 100% test coverage (99736fc)
- build: add Build Demo site to CircleCI task (62ed009)
Bug Fixes
- odata: no single quote escape required for IN operator for non-string column (6e4a855)
- picker: make sure picker addon is available before translating (e295c26)
- filter: updateFilters w/BackendService should call query only once (8228799)
- editor: Select Editor with option "0" were incorrectly filtered out (e116340)
- filter: Date Filters using Flatpickr throw error w/invalid locale (7c55a26), closes #346
- filter: default operator of input filter should be empty (17c905d)
- filter: number filter condition, parse number before comparing (55f5fc9)
- backend: make sure pagination object exist before using it (07dbbb1)
Full Test Coverage & new Formatter Options
This week Angular-Slickgrid just hit a Major Milestone 🚀 , the library is now Fully Tested with a test coverage of 99.7%. Why not 100% you might ask? Well there's about 25 lines that I haven't found out how to test and/or are lines that are unreachable from a test perspective. So I'm happy to put this aside as a completed task.
This version also adds some extra Formatter Options (a total of 6 options available) that can be applied to all regular Formatters/Grouping Formatters at once (even globally if you wish), these are the 2 new options (decimalSeparator
and thousandSeparator
) and more info can be found in this Wiki.
So please, if you like the lib and haven't yet up voted, please do so ⭐️ cheers 😸
Even though most of the work was done by myself, I am thankful for all feedback & contributions, even small, to make this library more stable and what it is today. I also see more questions about Angular-Slickgrid on Stack Overflow, which is great and is also the best place to ask for questions so please continue on that trend as more people can answer your questions.
Cheers
Ghislain aka @ghiscoding
Some Unit Tests & Code Statistics
- 135 files tested
- ~8000 lines tested
- ~2200 unit tests
- 99.7% test coverage (~25 lines are untestable)
- you can see the full test coverage via codecov
You thought Angular-Slickgrid was just a simple SlickGrid wrapper... well think again 👷
Release
Features
- cypress: upgrade to latest version of Cypress (0f1fd87)
- formatterOptions: add decimal,thousand separator to all Formatters (20345bb)
- tests: add missing unit tests for Excel Export Service (eb0a536)
- tests: add more Angular-Slickgrid component unit tests (01bfd6f)
- tests: Angular-Slickgrid Component add missing unit tests (0094494)
Fixes
Excel Export and other fixes
This new version brings a feature that I wanted to add for a long time Excel Export, this will also be the new default exporter (via a new flag enableExcelExport
). There are new settings which are very similar to the previous CSV export (which still exists under the flag enableExport
). More info can be found under the new Wiki - Export to Excel. You can see a demo on these 2 examples Grouping and Localization, all of the grids also have the new default Excel Export in their Grid Menu (aka hamburger menu)
Last but not least, if you like the lib and haven't yet up voted, please do ⭐️ cheers 😸
New Excel Export
enableExcelExport
excelExportOptions
CSV and/or Text with Tab Delimited (still exist but no longer the default)
enableExport
exportOptions
Very Important Change to your App
With the addition of Excel Export, you need to modify your tsconfig.app.json
and add the following line. If you forget to do this then your Angular Build will fail with a jszip
error, this new lib is used by the Excel Export (that is Excel-Builder lib) and it seems that the Build/TS has some problems finding the correct path unless we tell it where to find it.
"compilerOptions": {
// ...
"paths": {
"jszip": ["../node_modules/jszip/dist/jszip.min.js"]
}
},
Features
- bootstrap: add Bootstrap Action Dropdown example (0b96746)
- excel: add Excel Export feature and add full unit test suite (d787131)
- export: add Export to Excel feature (f06977f)
- tests: add more grid service unit tests (a2ddab2)
- rowDetail: expose public all render/redraw methods of Row Detail (de0b3e9)
- cypress: add Pagination Service E2E tests (72f6df3)
- styling: improve header menu styling (ba28d2b)
- tests: add Angular-Slickgrid component tests (1e84911 / 60192cd)
- tests: starting adding Slick-Pagination Component unit tests (b48ee06)
Bug Fixes
- gridService: addItem/updatedItemById must pass an array to setSelectedRows (#308)
- excel: exporting to Excel should also work from Grid Menu (b2f0680)
- filter: should be able to filter even on hidden columns, fixes #310 (47a1ab7)
- editor: autocommit should not save if value is the same as before (a07d239)
- editor: provide complex object override path for select editor (a93a53d)
- frozen: fix header grouping grid with frozen columns, fixes #290 (b851224)
- editor: use editorOptions only (08b1930)
- graphql: pagination offset should never be below zero (41e321f)
- graphql: translate pagination texts on initial load (3ecd9b9)
- odata: filter with single quote should be escaped, fixes #328 (1cd0b47)
- styling: hidden menu visible in BS4 for Picker/Grid Menu, fix #321 (9d597c4)
OData, GridService & Angular 8 improvements & increase in Unit Tests coverage
This new version adds a couple of noteworthy features for OData and also the GridService which can now insert an item on top or bottom of the grid. Another well worth to know addition is the full unit tests coverage >95% of all Editors & Filters (there's only 2 files left to test), of course a couple of issues were found while doing these tests, for example Editors weren't working correctly with complex objects (field with dot notation) and now they do.
Angular 8
The latest version of SlickGrid (core lib) addressed a couple of issues with ES2015
compilation, so with these fixes in the core and now used by Angular-Slickgrid, you can now change your build target
to ES2015
(which is the default in Angular 8). This allows for much smaller bundle in modern browser (ref issues #284 and #266). Also note that the GitHub Bootstrap 3 & 4 demos are now built with this new ES2015
target without any problem.
OData
In terms of OData features, the count can now be part of the OData query (it's an optin, you need to enable it yourself via the new options enableCount
), you can see the updated OData Example. Also I would be happy to have some volunteers who can help me improve the OData usage by moving the postProcess
necessary code inside the Angular-Slickgrid which would cleanup your client code (the GraphQL already uses this technique), I'm asking for volunteer since I don't personally have access to an OData server anymore.
Deprecations
The statistic
property was replaced by metrics
which is a better representing word, the previous property name still works but it's better to change the name when you have a chance. You can see an example here, which can be displayed as Metrics: 2019-10-02 17:03 pm | 6 of 500 items
(you can customize the output)
Comments/Issues
I have to mention that if you find and report an issue, please fill in the issue template, it helps in analyzing and troubleshooting the issue and it's only couple of questions. Too many times I see people deleting the template and I have to ask the same questions that were asked in the template. Also please remember that Stack Overflow is great for general questions.
Last but not least, if you like the lib and haven't yet up voted, please do ⭐️ cheers 😸
Features
- metrics: deprecated Statistic and renamed to Metrics (aea60a9)
- odata: add "enableCount" flag to add to OData query, closes #287 (1d70037)
- insert: add option to insert item at bottom of grid (32764fb)
- upsert: add option to upsert item at bottom of grid & view scroll (7b25dd7)
- tests: add AutoComplete Filter test suite (8ccea92)
- tests: add AutoComplete missing test (313da78)
- tests: add missing AutoComplete unit tests (24487a4)
- tests: add missing unit tests for all Editors (c275b87)
- tests: add more Single & MultipleSelectEditor unit tests (9dc1abe)
- tests: add some tests for the AutoComplete Editor (360da3e)
- backend: extract Pagination into its own Service to expose methods (4a4a708)
- example: add programmatically Pagination change sample (a150807)
- export: add delimiter/listSeparator override to use with GraphQL (de52614)
- example: add Bootstrap Dropdown Action demo, closes #304 (ba6082c)
Bug Fixes
- build: use latest SlickGrid version to fix ES2015 build, issues #284, #266 (ff9f9d8)
- editors: complex objects should work with all editors (01f53ed)
- insert: add item to bottom position should highlight correctly (9f9e6eb)
- styling: styling issue in Firefox after col reordering, fixes #297 (a2c7e39)
- gridService: upsertItem(s) should trigger onItemAdded/Updated event (df9af21)
- pagination: when item is added it should trigger pagination changed (c953a23)
- pagination: don't reset page 1 after manually adding items to grid (f61285d)
`ngx-translate` now optional & new Range Filters feature
This new release introduces couple of big new features, the 2 biggest ones are the following:
ngx-translate
now optional... you no longer need to installngx-translate
when using only 1 locale (English or any other locale). If it's other than English, you can also provide a custom locale file, more info in links below.- new Wiki Localization-with-Custom-Locales and a new demo repo. 🎉
- Add new Range Filters, basically allows to have filter between min/max values but combined into 1 column filter. You can use a regular input filter and use the 2 dots notation to separate 2 numbers (e.g.:
5..10
between 5 and 10), and there are also 2 new Filters which are the Slider Range and the Date Range Filters. These new filters also work with the Backend Services (OData, GraphQL) which were updated and tested.- new Wiki Range Filters and new Example 25 to demo this new feature.
Other interesting additions
- add support of OData v4
- add more Cypress E2E tests
- thanks to @bocall, all angular-slickgrid-demos were updated to Angular 8.2
Also worth knowing that every single bug reported that were fixed in the past month now also have Cypress tests to avoid seeing these bugs again.
Important Note
We now have a new centralized angular-slickgrid-demos (replacing the standalone BS4 demo), so make sure to head over that repo to see all the existing Angular-Slickgrid examples. It includes a bunch of demos with/without ngx-translate
and with Bootstrap 3 / 4
Use and like this library... please make sure to up vote ⭐️
Features
- filter: add a few input/compoundInput filters test (190176a)
- filter: add Cypress E2E tests for the Filter by Range grid (7da17f8)
- filter: add DateRange Filter unit test & refactor code (308082f)
- filter: add input search range functionality, ref issue #240 (7273cf8)
- filter: add new rangeDate Filter (0878569)
- filter: add new SliderRange Filter (26dc63c)
- filter: add optional placeholder to multiple select (1b1274b)
- filter: add SliderRange Filter unit tests & fix searchTerms input (be136be)
- locales: add unit tests when using locales with enableTranslate (413ea71)
- locales: add unit tests when using locales with enableTranslate (ae48ddf)
- sorters: consolidate & provide all date sorters (fdc1155)
- tests: add Cypress E2E tests to cover hidden columns, closes #250 (22868f5)
- translate: add optional Locale functionality (8f24d2d | 86b1214 | 5eb1ec1 | 0d6b2e2)
- tests: add SelectFilter unit tests (5115e08)
- tests: add CompoundDate Filter unit tests (45348a0)
- tests: add CompoundSlider Filter unit tests (06abb3d)
- tests: add NativeSelect Filter unit tests & tweak some Filters (4b952c9)
- tests: add slider unit tests (5ae1a85)
Bug Fixes
- editor: fix negative number in floatEditor (7ae5a7)
- dom: ColumnPicker & GridMenu were creating multiple DOM elements (8916f90)
- gridMenu: add more type checks to avoid console error, fixes #268 (328c9af)
- odata: use contains with OData version 4 (e936f33)
- presets: Grid State & Presets stopped working for columns (4e0b528)
- styling: fix some Bootstrap 4 styling (ee4931c)
- backend: queries should not include pagination option when disabled (d648b80)
- test: fix a Cypress flaky test that was sometime failing (4ed5a29)
- core: dowgrade to previous SlickGrid version to fix issues (1fd11ab)