I'm submitting a bug report

• Browser:
  IE 11

Current behavior:
Example 3, 4 and 5 are not showing up and are missing some Polyfills. If we take Example 5, we can see this error thrown in the console

Object doesn't support property or method 'includes'

Expected/desired behavior:

• What is the expected behavior?
  No console errors

• What is the motivation / use case for changing the behavior?
  Support IE 11

I'm submitting a feature request

• Language:
  TypeScript

Current behavior:
The collectionService only provides simply filtering on a collection with a property and a value

Expected/desired behavior:

• What is the expected behavior?
  Add a callback either as the operator?: OperatorType.equal | OperatorType.notEqual | Function; or create a separate property called callback.

• What is the motivation / use case for changing the behavior?
  This will allow for more advanced filtering.

@ghiscoding I wanted your feedback before I started doing this. 1. Do you think this is a good idea and 2 where should i put this callback property (and what name do you prefer) on the CollectionFilterBy model. I think this will provide more robust filtering when a simple property and value will not be sufficient.

I'm submitting a feature request

Expected/desired behavior:

• What is the motivation / use case for changing the behavior?
  Easier way to use Operator (<, <=, >, >=, ...) with Filters

@jmzagorski
Opening this simply for reference and discussions about latest version 1.9.0

1. Jumped over 1.8.0, I'm so used to updating the package.json directly for the version that I forgot that isn't needed anymore, which explain the jump.
2. Have you started using WebPack 4? I see the Aurelia-CLI got some commit around it
3. I'm having some issues with the Build of Github Page, have you ever seen this problem? There's no double quotes on any of the scrips src or css href. That is causing some issues with the demo, until I change them all (by hand) to be wrapper in double quotes.
   1. I have tried to update a few of the Aurelia lib but that doesn't seem to do any changes
   2. could it be the webpack.config?

I'm submitting a feature request

• Browser:
  all

• Language:
  TypeScript

Current behavior:
Not Implemented

• What is the motivation / use case for changing the behavior?
  Currently there are select, singleSelect and multipleSelect header filters. Would it be possible to implement SelectListEditor, SingleSelectListEditor and MultipleSelectListEditor? I created a proof of concept for myself to see if this was possible using the using the columnDefinition.filter properties. I used those property values because the editor select list would behave the same as the header filter if only the values in the header's select list were allowed to be chosen.

Benefits:

1. Data Integrity on the grid
2. Easier for the user to see predefined values if there are a lot

Challenges (I am sure there are others I cannot think of):

1. Sorting: if the value is an integer and the label is a text field, the gird will sort on the value and not label.

I'm submitting a bug report

• Library Version:
  2.6.0

Please tell us about your environment:

• Operating System:
  Windows

• Bundler used (WebPack/RequireJS/SystemJS
  all

• Browser:
  all

• Language:
  all

Current behavior:
Toggling group doesn't work

Expected/desired behavior:

• What is the expected behavior?
  Toggle of groups should work

• What is the motivation / use case for changing the behavior?

I'm submitting a bug report

Current behavior:
while implementing PR #70 in my Angular-Slickgrid repo, I noticed that Angular throws me some circular dependency warnings

WARNING in Circular dependency detected:
src\app\modules\angular-slickgrid\sorters\dateUsSorter.ts -> src\app\modules\angular-slickgrid\sorters\sorterUtilities.ts -> src\app\modules\angular-slickgrid\sorters\index.ts -> src\app\modules\angular-slickgrid\sorters\dateUsSorter.ts

that is because sorterUtilities.ts import Sorters, then each Sorter import sorterUtilities and so... we are in a circular dependency injection. I had to get this new compareDates() function into it's own file.
Expected/desired behavior:

• What is the expected behavior?
  no warnings

I'm submitting a feature request

• Framework Version:
  current

Please tell us about your environment:

• Operating System:
  All

• Browser:
  all

• Language:
  TypeScript X.X

Current behavior:
AureliaSlickgridCustomElement has a defaultBinding of twoWay on the dataset property in https://github.com/ghiscoding/aurelia-slickgrid/blob/master/aurelia-slickgrid/src/aurelia-slickgrid/aurelia-slickgrid.ts#L70

Expected/desired behavior:

• What is the expected behavior?
  Do not specify a default binding, let it "default" to aurelia's default of oneWay

• What is the motivation / use case for changing the behavior?
  I do not think we need the overhead of bindingMode.twoWay for the dataset property. The custom aurelia-slickgrid element will never update the dataset, but only get updates from the view model. Besides the slight overhead, there can be issues as I ran into. If a user is using the default dataset.bind in a view and that dataset is a getter property on the view model, the application will throw this error:

ERROR [app-router] TypeError: Cannot set property newDataset of #<Example4> which has only a getter

This issue is probabaly an edge case, but it does produce an Aurelia error that might be hard to debug for users. The work around is to make use dataset.one-way in the view, which will override the custom elements defaultBinding, but some users might not realize this error is coming from this library.

I can replicate this in example4.ts with the diffs below:

<template>
  <h2>${title}</h2>
  <div class="subtitle" innerhtml.bind="subTitle"></div>

  <aurelia-slickgrid grid-id="grid1" dataview.bind="dataview" grid.bind="gridObj" column-definitions.bind="columnDefinitions"
    grid-options.bind="gridOptions" 
- dataset.bind="dataset" 
+ dataset.bind="newDataset" 
asg-on-grid-state-service-changed.delegate="gridStateChanged($event.detail)">
  </aurelia-slickgrid>
</template>

- import {  autoinject } from 'aurelia-framework';
+ import { computedFrom, autoinject } from 'aurelia-framework';
import { CustomInputFilter } from './custom-inputFilter';
import { Column, FieldType, FilterType, Formatter, Formatters, GridOption, GridStateService } from '../../aurelia-slickgrid';

function randomBetween(min, max) {
  return Math.floor(Math.random() * (max - min + 1) + min);
}
const NB_ITEMS = 500;

@autoinject()
export class Example4 {
  title = 'Example 4: Client Side Sort/Filter';
  subTitle = `
  Sort/Filter on client side only using SlickGrid DataView (<a href="https://github.com/ghiscoding/aurelia-slickgrid/wiki/Sorting" target="_blank">Wiki link</a>)
  <br/>
  <ul class="small">
    <li>Support multi-sort (by default), hold "Shift" key and click on the next column to sort.
    <li>All column types support the following operators: (>, >=, <, <=, <>, !=, =, ==, *)
    <ul>
      <li>Example: >100 ... >=2001-01-01 ... >02/28/17</li>
      <li><b>Note:</b> For filters to work properly (default is string), make sure to provide a FieldType (type is against the dataset, not the Formatter)</li>
    </ul>
    <li>Date Filters</li>
    <ul>
      <li>FieldType of dateUtc/date (from dataset) can use an extra option of "filterSearchType" to let user filter more easily. For example, in the "UTC Date" field below, you can type "&gt;02/28/2017", also when dealing with UTC you have to take the time difference in consideration.</li>
    </ul>
    <li>On String filters, (*) can be used as startsWith (Hello* => matches "Hello Word") ... endsWith (*Doe => matches: "John Doe")</li>
    <li>Custom Filter are now possible, "Description" column below, is a customized InputFilter with different placeholder. See <a href="https://github.com/ghiscoding/aurelia-slickgrid/wiki/Custom-Filter" target="_blank">Wiki - Custom Filter</a>
  </ul>
`;

  columnDefinitions: Column[];
  gridOptions: GridOption;
  dataset: any[];

  constructor(private gridStateService: GridStateService) {
    this.defineGrid();
  }

  attached() {
    // populate the dataset once the grid is ready
    this.getData();
  }

  detached() {
    this.saveCurrentGridState();
  }

  /* Define grid Options and Columns */
  defineGrid() {
    // prepare a multiple-select array to filter with
    const multiSelectFilterArray = [];
    for (let i = 0; i < NB_ITEMS; i++) {
      multiSelectFilterArray.push({ value: i, label: i });
    }

    this.columnDefinitions = [
      {
        id: 'title',
        name: 'Title',
        field: 'title',
        filterable: true,
        sortable: true,
        type: FieldType.string,
        minWidth: 45,
        filter: {
          type: FilterType.compoundInput
        }
      },
      {
        id: 'description', name: 'Description', field: 'description', filterable: true, sortable: true, minWidth: 80,
        type: FieldType.string,
        filter: {
          type: FilterType.custom,
          customFilter: new CustomInputFilter() // create a new instance to make each Filter independent from each other
        }
      },
      {
        id: 'duration', name: 'Duration (days)', field: 'duration', sortable: true, type: FieldType.number, exportCsvForceToKeepAsString: true,
        minWidth: 55,
        filterable: true,
        filter: {
          collection: multiSelectFilterArray,
          type: FilterType.multipleSelect,
          searchTerms: [1, 33, 50], // default selection
          // we could add certain option(s) to the "multiple-select" plugin
          filterOptions: {
            maxHeight: 250,
            width: 175
          }
        }
      },
      {
        id: 'complete', name: '% Complete', field: 'percentComplete', formatter: Formatters.percentCompleteBar, minWidth: 70, type: FieldType.number, sortable: true,
        filterable: true, filter: { type: FilterType.compoundInput }
      },
      {
        id: 'start', name: 'Start', field: 'start', formatter: Formatters.dateIso, sortable: true, minWidth: 75, exportWithFormatter: true,
        type: FieldType.date, filterable: true, filter: { type: FilterType.compoundDate }
      },
      {
        id: 'usDateShort', name: 'US Date Short', field: 'usDateShort', sortable: true, minWidth: 70, width: 70,
        type: FieldType.dateUsShort, filterable: true, filter: { type: FilterType.compoundDate }
      },
      {
        id: 'utcDate', name: 'UTC Date', field: 'utcDate', formatter: Formatters.dateTimeIsoAmPm, sortable: true, minWidth: 115,
        type: FieldType.dateUtc, outputType: FieldType.dateTimeIsoAmPm, filterable: true, filter: { type: FilterType.compoundDate }
      },
      {
        id: 'effort-driven', name: 'Effort Driven', field: 'effortDriven', minWidth: 85, maxWidth: 85, formatter: Formatters.checkmark,
        type: FieldType.boolean,
        sortable: true,
        filterable: true,
        filter: {
          collection: [{ value: '', label: '' }, { value: true, label: 'True' }, { value: false, label: 'False' }],
          type: FilterType.singleSelect,

          // we could add certain option(s) to the "multiple-select" plugin
          filterOptions: {
            autoDropWidth: true
          },
        }
      }
    ];

    this.gridOptions = {
      autoResize: {
        containerId: 'demo-container',
        sidePadding: 15
      },
      enableFiltering: true,

      // use columnDef searchTerms OR use presets as shown below
      presets: {
        filters: [
          { columnId: 'duration', searchTerms: [2, 22, 44] },
          // { columnId: 'complete', searchTerm: '5', operator: '>' },
          { columnId: 'usDateShort', operator: '<', searchTerm: '4/20/25' },
          // { columnId: 'effort-driven', searchTerm: true }
        ],
        sorters: [
          { columnId: 'duration', direction: 'DESC' },
          { columnId: 'complete', direction: 'ASC' }
        ],
      }
    };
  }

+  @computedFrom('dataset')
+  get newDataset() {
+    console.log('got dataset');
+    return !this.dataset ? [] : this.dataset.map(d => ({
+      ...d,
+      // create some random computed property here
+    }));
+  }

  getData() {
    // mock a dataset
    this.dataset = [];
    for (let i = 0; i < NB_ITEMS; i++) {
      const randomDuration = Math.round(Math.random() * 100);
      const randomYear = randomBetween(2000, 2025);
      const randomYearShort = randomBetween(10, 25);
      const randomMonth = randomBetween(1, 12);
      const randomMonthStr = (randomMonth < 10) ? `0${randomMonth}` : randomMonth;
      const randomDay = randomBetween(10, 28);
      const randomPercent = randomBetween(0, 100);
      const randomHour = randomBetween(10, 23);
      const randomTime = randomBetween(10, 59);

      this.dataset[i] = {
        id: i,
        title: 'Task ' + i,
        description: (i % 5) ? 'desc ' + i : null, // also add some random to test NULL field
        duration: randomDuration,
        percentComplete: randomPercent,
        percentCompleteNumber: randomPercent,
        start: new Date(randomYear, randomMonth, randomDay),          // provide a Date format
        usDateShort: `${randomMonth}/${randomDay}/${randomYearShort}`, // provide a date US Short in the dataset
        utcDate: `${randomYear}-${randomMonthStr}-${randomDay}T${randomHour}:${randomTime}:${randomTime}Z`,
        effortDriven: (i % 3 === 0)
      };
    }
  }

  /** Dispatched event of a Grid State Changed event */
  gridStateChanged(gridState) {
    console.log('Client sample, Grid State changed:: ', gridState);
  }

  /** Save current Filters, Sorters in LocaleStorage or DB */
  saveCurrentGridState() {
    console.log('Client sample, current Grid State:: ', this.gridStateService.getCurrentGridState());
  }
}

I'm submitting a bug report

Current behavior:
"Select All" checkbox is always displayed in the Column Headers section. We can see this behavior in the demo

A PR was opened and merged in the 6pac repo, waiting for a new release (will probably be 2.3.21 since latest 2.3.20 version has an undesirable bug)

Expected/desired behavior:

• What is the expected behavior?
  As the title says, we shouldn't display or at least provide a way to hide the "Select All" checkbox when we know that we are using Single Row Selection.

• What is the motivation / use case for changing the behavior?

I'm submitting a Bug report

Your Environment

Context

I currently have 2 slickgrids in the same view. I want to save both their states to the database. The problem however is that the gridStateService still seems to be a singular object. So only the state of the 2nd grid is saved correctly.

Expected Behavior

I expected that both grids have their own gridStateService, so both states can be saved.

Current Behavior

Only the 2nd grid saves it's state correctly. I've been testing some of the variables and the result was:
this.gridRequest.exportService === this.gridAvailability.exportService -> false
this.gridRequest.extensionService === this.gridAvailability.extensionService -> false
this.gridRequest.filterService === this.gridAvailability.filterService -> false
this.gridRequest.gridEventService === this.gridAvailability.gridEventService -> false
this.gridRequest.groupingService === this.gridAvailability.groupingService -> false
this.gridRequest.gridStateService === this.gridAvailability.gridStateService -> true
this.gridRequest.sortService === this.gridAvailability.sortService -> false
this.gridRequest.gridService === this.gridAvailability.gridService -> false

It seems that the gridStateService is shared amongst the 2 grid, causing this problem.

Upcoming, missing, incomplete or simply a wish list feature

Completed Features

• Controls / Plugins
  • Remote Model (AJAX) Plugin - (ref PR #115)
  • Grid Menu (aka hamburger menu)
  • Row Move Manager Plugin (ref #110)
  • Header Menu Plugin
  • Column Picker
  • Column Header Button Plugin
  • Column Header Menu Plugin
    • Add "hide column" command in menu, driven by the ControlAndPlugin Service
    • Add "sort" ASC/DESC command in menu, driven by the ControlAndPlugin Service
  • Row Detail Panel, see SlickGrid demo - (PR #113)
• Editors
  • Date Editor (with Flatpickr)
  • Long Text with Textarea
  • Input
  • Multiple Select / Single Select
  • Custom Editor
  • Slider Editor
  • Undo Functionality
  • Dependencies Injection (DI) in Editors (ref #25)
  • MultipleSelect & SingleSelect Editor should be able to render sanitized HTML (ref #87)
  • Editor Collection Async load and collection changes should refresh select dropdown (ref #183
• Filters
  • Input
  • Multiple Select / Single Select
  • Custom Filter
  • Compound Input Filters (ref #26)
  • Compound Date Filters (ref #26)
  • Compound Slider (ref #79)
  • Slider filter (ref #79)
  • MultipleSelect & SingleSelect Filter should be able to render sanitized HTML (ref #87)
  • Filter Collection Async load and collection changes should refresh select dropdown (ref #83)
  • Compound Input Filter should support multiple input type, not only text but also number,
  • Datalist Filter (issue #17 / see PR #122)password (PR #117)
  • Input Mask Filter (see PR #132)
  • Number Range Filter
  • Date Range Filter
  • Slider Range Filter
• Copy & Paste like Excel, see SlickGrid demo
• Support single & multi-columns with numbering icons and tri-state option, see SlickGrid demo
• Colspan, see SlickGrid demo
• Column Header Grouping colspan, see SlickGrid demo
• Export to File
  • Export to CSV
  • Export to text file with any separator type
  • Export to Excel using ExcelBuilder, see UI Grid demo and UI Grid code
• Grid State & Grid Presets
  • Current Filters
  • Current Sorters
  • Current Pagination (Backend Service)
  • Current Column Visibility (show/hide state) (ref #67)
  • Current Column position order (ref #67)
• Grouping
  • Grouping and Aggregate (ref #37), see SlickGrid demo
  • Grouping by Column Dragging, see SlickGrid demo - (PR #114)
• Support i18n accross the lib
• Grid Auto-resize
• Row Selection
• Dynamically add or change Column Definitions (ref #57)
• Multiple Grid in 1 View (ref #36)
• Support latest Bootstrap 4
• Pinned (frozen) Columns/Rows (see PR #121)
• Add full Unit Test Suite
• Update Pagination (with Backend Service) Dynamically on the fly
• Update Filters Dynamically on the fly
• Update Sorting Dynamically on the fly

I'm submitting a bug report

• Library Version:
  Current

Please tell us about your environment:

• Operating System:
  Windows 10

• Browser:
  all

• Language:
  TypeScript

Current behavior:
If the select list is open and a user hits tab, the select list remains open. If you try to select a value nothing happens since tab has activated the next cell

Expected/desired behavior:

• What is the expected behavior?
  The select list closes

• What is the motivation / use case for changing the behavior?
  It is really not a big bug, but makes the user experience better if the select list went away or if tab did nothing, whichever you thought was better

I'm submitting a feature request

• Framework Version:
  current

• Browser:
  all

• Language:
  TypeScript

Current behavior:
Inline editors do not commit the value to the grid unless the user selects another cell or hits the enter/tab key. Some references to this issue include:

https://coderwall.com/p/vztjkg/make-sure-slickgrid-commit-the-changes-when-click-on-submit-button-without-move-focus-out-of-the-input

mleibman/SlickGrid#873

Expected/desired behavior:

• What is the expected behavior?
  We could add a grid or editor option flag to commit on blur/focusout so the value in the editor is commited when the editor looses focus

• What is the motivation / use case for changing the behavior?
  It is more natural for a user to change the value in an inline editor and then navigate away from the grid to either save the values or do something else. I wanted your thoughts on this to see if it will be a useful feature for this library. I have not solved it in my app yet because the select editors act different when the
  focusoutevent ocurrs, which is the event i was listening for.

I'm submitting a feature request

• Browser:
  all

• Language:
  TypeScript

Current behavior:
not implemented

• What is the motivation / use case for changing the behavior?
  I would like to be able to load the grid with some presets (filters/orders/pagination) and/or expose them so that we can save them in LocalStorage or reload them from LocalStorage/DB.

Here's a list of what cannot be done currently in version 1.x until a new major release comes out 2.x which mean breaking changes

• 1. GridEvent Service, no longer references the 2nd argument gridOptions (closed by PR #51)
• 2. a lot of the Services instantiated in aurelia-slickgrid ViewModel use an init() which usually ask for init(grid, gridOptions, dataView) but once we get the grid object, we actually have access to the gridOptions, so we can simplify this a lot (closed by PR #55).
• 3. remove all deprecated code (just search for the word deprecated), code change could be renamed or re-implemented
  • a. onBackendEventApi was re-implemented and replaced by backendServiceApi (commit)
• 4. remove possibly unnecessary global Event Aggregators (EA) by Element Dispatch (ED)
  • a. to be discussed, having EA globally might help in some cases, in my current project I have a left side menu that when triggered needs to resize the grid (autoResize doesn't work in that case) and I don't think it would be possible without an EA.
  • b. use asg for Aurelia Events and sg for SlickGrid/DataView Events & rename eventPrefix to slickgridEventPrefix (commit)
• 5. Filter could only use searchTerms array instead of doing multiple logic to deal with searchTerm (singular) and searchTerms array (commit).
• 6. Remove all previous reference of selectOptions in all Filters (commit)
• 7. Editors/Filters should use a common Column property and possibly remove the filter Column property.
• 8. remove FormElementType from Filters, it should only use FilterType (commit)
  • a. the FormElementType is actually not used anywhere else I think, so might be better to delete it completely
• 9. BackendService API onFilterChanged Event and function should not be named the same, it is rather confusing when troubleshooting, maybe change function to processFilterChanged (commit)
• 10. remove exportWithFormatter from GridOptions.interface since it is now part of exportOptions (commit)
• 11. GridMenu has both hideX and showX flags, they should all be hideX since that is the default name in the external plugins (commit)
• 12. Possibly rename the GridExtraService to simply GridService (commit)
• 13. A lot of the Editors properties (like collection) are available only from the generic params property which removes the benefit of intellisense and type check. This goes with number 7.
• 14. Remove the initOptions from the BackendService, that was replaced by init some time ago (commit)
• 15. GridExtraUtil contain only 1 function, it would be better to move it into the renamed GridService and delete GridExtraUtil completely (commit)
• 16. Should pass i18n as a Grid Options instead of a generic params grid option and fix a column picker issue (commit)
• 17. change all Singleton Services to non-Singleton (commit)
• 18. renamed onGridStateServiceChanged to onGridStateChanged
• 19. add multiple grids in a view (commit and commit)
• 20. change column.interface signature of onCellClick and onCellChange to expose event as first argument to keep consistent with SlickGrid, see issue #60
• 21. update Migration Guide
• 22. update all client-cli and GitHub demo samples
• 23. update Wikis and there's a lot

This list will be taken into consideration in the version 2.x which will be a Major and breaking version.
Simply keeping this for reference as of now.

Also, don't expect a version 2.x any time soon.
This will be addressed only when we decided that all features that we want are in place and we want to get rid of all properties and naming that weren't of good use in 1.x.

Migration Guide will be available here

I'm submitting a bug report

• Library Version:
  2.2.3

• Bundler used (WebPack/RequireJS/SystemJS
  WebPack

• Browser:
  all

Current behavior:
When using enableGrouping and enableFiltering together in Grid Options I am getting Unexpected token , error thrown by SlickGrid DataView.

this.gridOptions = {
   enableGrouping: true,
   enableFiltering: true,
   exportOptions: {
        sanitizeDataExport: true
   }
}

Expected/desired behavior:

• What is the expected behavior?
  no errors

I'm submitting a feature request

• Browser:
  all
• Language:
  TypeScript

Current behavior:
Library/Custom Editors cannot use Aurelia's DI. External services, such as the i18n library, must be injected into the users view model and then added to the columnDef.params object just so the grid editor can use that service. Then, the Editors have to perform null checks to ensure the user sets the service on the params object. This means that our Editors using i18n (singleSelectEditor, multipleSelectEditor and dateTimeEditor) are dependent on the user passing in the service.

Expected/desired behavior:
Library/Custom Editors support Aurelia's DI. To implement this we need to loop through the columnDefinitions during the AureliaCustomElement binding and reset the columnDef.editor property with a wrapper such as:

    for (let c of this.columnDefinitions) {
      if (c.editor) {
        c.editor = Factory.of(c.editor).get(this.container)
      }
    }

• What is the motivation / use case for changing the behavior?
  I opened this issue for discussion to get your feedback. I have no need for it right now, but I wonder if it will make for a cleaner API instead of using the params property where other values are dumped.

Pros

1. Users do not have to inject services into their view model
   2 Reduce dependencies for the external service from 2 classes to 1 (2 classes being the Editor and the View Model)

Cons

1. We need to take dependencies on the Aurelia's Container and Factory resolver in the AureliaCustomElement (unless you could think of a better way)

I'm submitting a bug report

• Language:
  all

Current behavior:
Sort icons on last column is hidden behind Grid Menu with small dataset

Expected/desired behavior:

• What is the expected behavior?
  Scrolling should probably be displayed at all time since the Grid Menu rely on the fact that the scrolling bar is the same width as the Grid Menu.

• What is the motivation / use case for changing the behavior?

I'm submitting a bug report
I'm submitting a feature request

• Library Version:

Please tell us about your environment:

• Operating System:
  Windows [|10]

• Bundler used (WebPack/RequireJS/SystemJS
  WebPack

• Browser:
  all | Chrome XX | Firefox XX | Edge XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView

• Language:
  TypeScript

Current behavior:
There are filters on top of each column

Expected/desired behavior:
To have a single input field above the grid which searches in all the columns. Can I know how to do it? Just some brief pointers would be helpful and highly appreciated.

In the image attached you can see what my expectations are, when I select all it should search in all the columns or if I select any specific column, it should search in that particular column. Currently we are using au-table to achieve this, and we are moving away from au-table to aurelia-slickgrid, as slickgrid is amazing with plenty of features.

I'm submitting a feature request

Current behavior:
Always show as a dropdown

Expected/desired behavior:

• What is the expected behavior?
  Use as a dropup (going up) or dropdown (going down which is the default)

• What is the motivation / use case for changing the behavior?
  More user friendly UI

I'm submitting a feature request

• Browser:
  all

• Language:
  TypeScript

Current behavior:
Not implemented

• What is the motivation / use case for changing the behavior?
  Many users prefer the datalist/typeahead feature because it is faster than scrolling through a select list. #9 is where the conversation got started, and below is a summary.

1. The html datalist is not supported in Safari and partially support in IE
2. Libraries to consider: purejs-datalist-polyfill, jquery datalist polyfill and typeahead. The drawback to this is adding another dependency in this library.

I'm submitting a bug report

Current behavior:
Doesn't seem to display days properly. Also choosing a date in the picker doesn't reflect the same date in the grid when it closes. I wonder if it's yet another flatpickr update issue, it always seem to have problem with TypeScript

Expected/desired behavior:

• What is the expected behavior?
  The picker should work accordingly

I'm submitting a bug report

Current behavior:
If we sort the collection to be descending and we have a value higher than 10, it will select an incorrect value in the editor. For example, if the value is 94, it will incorrectly choose 4.

Expected/desired behavior:

• What is the expected behavior?
  Choose the correct value in the editor

• What is the motivation / use case for changing the behavior?

I'm submitting a bug report

Please tell us about your environment:

• Operating System:
  Windows [10]

• Bundler used (WebPack/RequireJS/SystemJS
  WebPack

• Browser:
  all

• Language:
  TypeScript X.X

Current behavior:
grid is not loaded correctly under bootstrap tabbed view headers are going in and the size is not correct. containerId is given as router-view div id or another div created and given that Id, behaviour is still the same. we could fix this issue with some custom css changes. But would like to know what is causing this issue. And when broswer window is resized, it renders correctly as expected. Please refer to the screen recording I provided.

Expected/desired behavior:

Need to render the grid correctly as a tabbed view

example4.zip

I'm submitting a bug report

ERROR in ./node_modules/aurelia-slickgrid/dist/native-modules/filters/selectFilter.js
Module not found: Error: Can't resolve 'aurelia-http-client' in '.\node_modules\aurelia-slickgrid\dist\native-modules\filters'

• Library Version:
  2.3.0

Please tell us about your environment:

• Operating System:
  Windows 10

• Bundler used (WebPack/RequireJS/SystemJS)
  Webpack with aurelia cli

• Browser:
  all

• Language:
  TypeScript

Current behavior:
The library requires the use of aurelia-http-client

Expected/desired behavior:

• What is the expected behavior?
  The library should not require this library and throw this error

• What is the motivation / use case for changing the behavior?
  This may not give a good user experience because the grid should work "out of the box". Many user will probably use aurelia's library, but we should not force them to do so, especially since the aurelia CLI does not install the aurelia-http-client with au new.

I found this when starting a new application trying to create a simple 3 column grid where my API call was mocked. This library is found in the select filter and the main custom element used with instance of and to define a type for the parameter.

EDIT: Actually I forgot the fetch-client and http-client are two different libraries. Some users may only use the fetch-client.

I'm submitting a feature request

Suggestion: it would be nice to have all labels that are actually hardcoded in application (ex. 'Force fit columns', 'Synchronous resize', 'Page n of n', 'items per page', 'n-n of n items') configurables via configuration object.

I'm submitting a feature request

Current behavior:
Not currently available

Expected/desired behavior:

• What is the motivation / use case for changing the behavior?
  I want to be able to change/add Column Definitions dynamically and/or change Grid Options dynamically

I was reviewing your prior commits and saw you improved the filtering by adding a filter interface. I think we can take this one step further by using a factory to create the filters and allow Aurelia to inject any number of dependencies that are needed in the filters. I'll explain with current vs future state below:

Current State:
In the filter interface you manually instantiate a filter using a switch(filterType) and passing in the i18n service that is injected into the FilterService.

Future State:

1. We add a property on the Filter interface that requires every Filter implementation to have a FilterType value (ie the SelectFilter would have filterType = FilterType.select.
2. We code a new FilterFactory such as:

@inject(All.of('GridFilters'))
export class FilterFactory {

constructor(private filters: Filter[]) {}

public createFilter: Filter (filterType: string) {
  return this.filters.find(f => f.filterType === filterType);
  // or throw an exception if a filter is not found
}

3. Tell Aurelia about our new objects in main.ts:

aurelia.container.registerSingleton('GridFilters', InputFilter);
aurelia.container.registerSingleton('GridFilters', SelectFilter);
aurelia.container.registerSingleton('GridFilters', SingleSelectFilter);
aurelia.container.registerSingleton('GridFilters', MultipleSelectFilter);

Benefits:

1. This allows Aurelia to handle the dependency graphs for each filter. This means we can inject any number of dependencies into the filters without bloating the FilterService. This is a huge benefit. One example I can think of is using the BindingEngine from aurelia-framework to watch the collection property on the select list filters ( :-) could be a future pull request). Right now the library assumes this collection will have all the data when the view model is ready. However, what if the consumer is using a generator instead of a promise, or they are fetching the data at some later time after the view model is already created or what if the consumer deletes a record in the grid that was in the select filter and should no longer be in the select filter (sorry for going off on tangent, but I have thought about this for a few days)

2. No longer need to inject the i18n in the filter interface since its only purpose was to pass it to the filters. Now we just need to inject the FilterFactory

3. Removes the responsibility of creating the filters from the FilterService. That means if we support another filter such as a datalist ( :-) I already thought of this for a future pull request) then we only have to create the DatalistFilter interface and add the filter to the list of 'GridFilters' in the main.ts. Then, there would be no to little change in the FilterService.

I can create this feature since I've done this in a deprecated project of mine https://github.com/jmzagorski/allforms/blob/master/src/main.js

I'm submitting a feature request

• Framework Version:
  2.0 potentially or 1.x if not breaking

Please tell us about your environment:

• Operating System:
  All

• Browser:
  all

• Language:
  TypeScript

Current behavior:
No supported since services are singletons and hold onto grid state

• What is the expected behavior?
  Services can act on multiple grids

• What is the motivation / use case for changing the behavior?

Copying over the discussion from #33 to keep track of progress on this:

Creating a singleton stateful service has some drawbacks, and we discussed one of those yesterday with multiple grids on the same page. I can think of 3 options if you wanted to change your services, both of which would fix the multiple grid problem because it would not have one state.

1. Inject all grid services as transient. This means every slickgrid custom element will get an new instance of the service and work with just with that grid. The downside of this is that these services cannot be used in view models since a new instance is created every time it is injected. However, it would fix the multiple grids on a page issue

2. Use an object on all services to keep track of which grids are passed into init by either using the object itself or the grid id. This could get complicated because every method call to a service would have to pass some key so the service knows which grid to operaton on. Since you would make to pass in a key anyway as an additional argument for this to work, number 3 would be a better choice.

3. Make a stateless services. By no state I mean they do not have properties for the grid or anything the custom element created at runtime, they just perform a service on the grid, dataview, columns or whatever is passed into their methods. For example this line would pass the grid and row number as parameters. Users can still use your service in their view models because you expose grid objects anyway and if a method required the grid they could pass it. This would allow multiple grids to be rendered on the same page too.

After typing all of that, number 1 would be the least amount of change, but break use of your services outside of the custom element. I would not recommend number 2. Number 3 is another good option because services should be stateless, but would required a rewrite of all service methods requiring a grid object.

number 3 would have to be in version 2 and most likely they get the grid from some event or leave it exposed as a bindable.

I think number 1 is just as good and didn't want to rule it out. It potentially would not add any breaking changes while fixing the multiple grid problem (i think). We would need to think of a way to expose your service methods with 1 or many grids, which is challenging if we inject the services with @transient. Based on the index file that would be quite a few service methods.

I'm submitting a bug report

• Framework Version:
  1.10.0

Please tell us about your environment:

• Operating System:
  Windows 10

• Browser:
  Tested on Chrome/Firefox, but should be a bug on all

• Language:
  Typescript

Current behavior:
The grid height and width are set using the bindingContext parameter on the bind method. However, the bindingContext will be my view model, which does not have a gridHeight or gridWidth properties because I am setting the height and width directly in the view like so:

<template>
  <aurelia-slickgrid 
    grid-id="elements-setup" 
    column-definitions.bind="elementColumns" 
    grid-options.bind="gridOptions" 
    dataset.bind="elements"
    grid-height="400" grid-width="800">
  </aurelia-slickgrid>
</template>

when inspecting binding.gridHeight and binding.gridWidth here, they are both undefined. They are undefined in Example1 too, so I am not sure how the height and width are being set to 800 and 400.

• What is the expected behavior?
  Should use this.gridHeight and this.gridWidth since those will always have the values. Also you can probabaly remove gridWidthString and gridHeightString properties since they are not in use

"aurelia-slickgrid": "^2.6.0"
"systemjs": "^0.21.5",
ESNext,
chrome Version 72.0.3626.121
nodejs: 10.15.0
windows10
I have a current app using systemjs for cli and I've tried a numbr of things but can't seem to get slickgrid to work. In the following repo I've tried to replace requirejs with systemjs but no errors and nothing is displayed.
https://github.com/johntom/aurelia-cli-slickgrid-systemjs
another attempt to place the grid in the working project systemjs cli project displays the following and the dataset gets poplated as expected.

aurelia-logging-console.js:51 ERROR [app-router] TypeError: Cannot assign to read only property 
'dataset' of object '#<HTMLElement>'
    at Object.setValue (aurelia-binding.js:3732)
    at Binding.updateTarget (aurelia-binding.js:4986)
    at Binding.bind (aurelia-binding.js:5044)
    at View.bind (aurelia-templating.js:1700)
    at Controller.bind (aurelia-templating.js:3750)
    at Controller.automate (aurelia-templating.js:3695)
    at ready (router-view.js:171)
    at RouterView.swap (router-view.js:200)
    at aurelia-router.js:276
    at Array.forEach (<anonymous>)
    at aurelia-router.js:275
    at n (browser.js:1)
    at browser.js:1
    at MutationObserver.t (browser.js:1)
error @ aurelia-logging-console.js:51

{
  "name": "slickgrid-test-cli",
  "type": "project:application",
  "bundler": {
    "id": "cli",
    "displayName": "Aurelia-CLI"
  },
  "build": {
    "targets": [
      {
        "id": "web",
        "displayName": "Web",
        "port": 9000,
        "index": "index.html",
        "baseDir": ".",
        "output": "scripts"
      }
    ],
    "options": {
      "minify": "stage & prod",
      "sourcemaps": "dev & stage"
    },
    "bundles": [
      {
        "name": "app-bundle.js",
        "source": [
          "[**/*.js]",
          "**/*.{css,html}"
        ]
      },
      {
        "name": "vendor-bundle.js",
        "prepend": [
          "node_modules/bluebird/js/browser/bluebird.core.js",
          "node_modules/aurelia-cli/lib/resources/scripts/configure-bluebird.js",
          "node_modules/systemjs/dist/system.js"
        ],
        "dependencies": [
          "aurelia-binding",
          "aurelia-bootstrapper",
          "aurelia-dependency-injection",
          "aurelia-event-aggregator",
          "aurelia-framework",
          "aurelia-history",
          "aurelia-history-browser",
          "aurelia-http-client",
          "aurelia-loader",
          "aurelia-loader-default",
          "aurelia-logging",
          "aurelia-logging-console",
          "aurelia-metadata",
          "aurelia-pal",
          "aurelia-pal-browser",
          "aurelia-path",
          "aurelia-polyfills",
          "aurelia-route-recognizer",
          "aurelia-router",
          "aurelia-task-queue",
          "aurelia-templating",
          "aurelia-templating-binding",
          "text",
          "jquery",
          "moment",
          "text-encoding-utf-8",
          {
            "name": "i18next",
            "path": "../node_modules/i18next/dist/umd",
            "main": "i18next"
          },
          {
            "name": "aurelia-i18n",
            "path": "../node_modules/aurelia-i18n/dist/amd",
            "main": "aurelia-i18n"
          },
          {
            "name": "i18next-xhr-backend",
            "path": "../node_modules/i18next-xhr-backend/dist/umd",
            "main": "i18nextXHRBackend"
          },
          {
            "name": "aurelia-templating-resources",
            "path": "../node_modules/aurelia-templating-resources/dist/amd",
            "main": "aurelia-templating-resources"
          },
          {
            "name": "aurelia-templating-router",
            "path": "../node_modules/aurelia-templating-router/dist/amd",
            "main": "aurelia-templating-router"
          },
          {
            "name": "aurelia-testing",
            "path": "../node_modules/aurelia-testing/dist/amd",
            "main": "aurelia-testing",
            "env": "dev"
          },
          {
            "name": "bootstrap",
            "path": "../node_modules/bootstrap/dist",
            "main": "js/bootstrap.min",
            "deps": [
              "jquery"
            ],
            "exports": "$",
            "resources": [
              "css/bootstrap.css"
            ]
          },
	    {
            "name": "text",
            "path": "../node_modules/systemjs-plugin-text",
            "main": "text"
          },
          {
            "name": "flatpickr",
            "path": "../node_modules/flatpickr/dist",
            "main": "flatpickr.min",
            "resources": [
              "flatpickr.min.css",
              "l10n/fr.js"
            ]
          },
          {
            "name": "lodash.isequal",
            "path": "../node_modules/lodash.isequal",
            "main": "index"
          },
          {
            "name": "multiple-select",
            "path": "../node_modules/aurelia-slickgrid/dist/lib/multiple-select",
            "main": "multiple-select",
            "resources": [
              "multiple-select.css"
            ]
          },
          {
            "name": "aurelia-slickgrid",
            "path": "../node_modules/aurelia-slickgrid/dist/amd",
            "main": "index",
            "resources": [
              "**/*.{css,html}"
            ]
          },
          {
            "name": "jquery-event",
            "path": "../node_modules/slickgrid/lib",
            "main": "jquery.event.drag-2.3.0"
          },
          {
            "name": "slick-gridmenu",
            "path": "../node_modules/slickgrid/controls",
            "main": "slick.gridmenu.js"
          },
          {
            "name": "jquery-ui-dist",
            "path": "../node_modules/jquery-ui-dist",
            "main": "jquery-ui"
          },
          {
            "name": "slickgrid",
            "main": "slick.grid",
            "path": "../node_modules/slickgrid",
            "deps": [
              "jquery",
              "jquery-event",
              "jquery-ui-dist"
            ],
            "resources": [
              "controls/*.js",
              "plugins/*.js",
              "slick.groupitemmetadataprovider.js"
            ]
          },
          {
            "name": "dompurify",
            "main": "dist/purify",
            "path": "../node_modules/dompurify",
            "resources": []
          }
        ]
      }
    ],
    "loader": {
      "type": "system",
      "configTarget": "vendor-bundle.js",
      "includeBundleMetadataInConfig": "auto",
      "plugins": [
        {
          "name": "text",
          "extensions": [
            ".html",
            ".css"
          ],
          "stub": false
        }
      ]
    }
  },
  "platform": {
    "id": "web",
    "displayName": "Web",
    "port": 9000,
    "index": "index.html",
    "baseDir": ".",
    "output": "scripts"
  },
  "transpiler": {
    "id": "babel",
    "displayName": "Babel",
    "fileExtension": ".js",
    "options": {
      "plugins": [
        "transform-es2015-modules-amd"
      ]
    },
    "source": "src/**/*.js"
  },
  "markupProcessor": {
    "id": "minimum",
    "displayName": "Minimal Minification",
    "fileExtension": ".html",
    "source": "src/**/*.html"
  },
  "cssProcessor": {
    "id": "none",
    "displayName": "None",
    "fileExtension": ".css",
    "source": "src/**/*.css"
  },
  "editor": {
    "id": "vscode",
    "displayName": "Visual Studio Code"
  },
  "unitTestRunner": {
    "id": "karma",
    "displayName": "Karma",
    "source": "test/unit/**/*.js"
  },
  "paths": {
    "root": "src",
    "resources": "resources",
    "elements": "resources/elements",
    "attributes": "resources/attributes",
    "valueConverters": "resources/value-converters",
    "bindingBehaviors": "resources/binding-behaviors"
  },
  "testFramework": {
    "id": "jasmine",
    "displayName": "Jasmine"
  }
}

"aurelia-slickgrid": "^2.6.0"
requirejs
ESNext,
chrome Version 72.0.3626.121
nodejs: 10.15.0
windows10

Trying to add slickgrid for a Demo/POC where I have materialize and kendoui working.
https://github.com/johntom/aurelia-cli-kendo-materialize-require
I followed the how to step guide but as soon as I add to to main.js,

 aurelia.use.plugin('aurelia-slickgrid'); 

I get

Failed to load resource: the server responded with a status of 404 (Not Found)
bluebird.core.js:1417 Unhandled rejection Error: Script error for "slickgrid/lib/jquery.event.drag-2.3.0", needed by: aurelia-slickgrid/aurelia-slickgridhttps://requirejs.org/docs/errors.html#scripterror    at makeError (http://localhost:9000/scripts/vendor-bundle.js:3980:17)    at HTMLScriptElement.onScriptError (http://localhost:9000/scripts/vendor-bundle.js:5550:36)From previous event:    at DefaultLoader.loadModule (http://localhost:9000/scripts/vendor-bundle.js:37461:12)    at _loadPlugin (http://localhost:9000/scripts/vendor-bundle.js:27863:19)    at http://localhost:9000/scripts/vendor-bundle.js:27847:16From previous event:    at loadPlugin (http://localhost:9000/scripts/vendor-bundle.js:27846:75)    at next (http://localhost:9000/scripts/vendor-bundle.js:28179:18)From previous event:    at next (http://localhost:9000/scripts/vendor-bundle.js:28179:54)    at http://localhost:9000/scripts/vendor-bundle.js:28187:14From previous event:    at FrameworkConfiguration.apply (http://localhost:9000/scripts/vendor-bundle.js:28171:42)    at Aurelia.start (http://localhost:9000/scripts/vendor-bundle.js:27715:37)    at Object.configure (http://localhost:9000/scripts/app-bundle.js:513:13)    at http://localhost:9000/scripts/vendor-bundle.js:26252:27From previous event:    at config (http://localhost:9000/scripts/vendor-bundle.js:26247:54)    at http://localhost:9000/scripts/vendor-bundle.js:26283:12From previous event:    at bootstrap (http://localhost:9000/scripts/vendor-bundle.js:26282:24)    at http://localhost:9000/scripts/vendor-bundle.js:26269:7From previous event:    at run (http://localhost:9000/scripts/vendor-bundle.js:26264:59)    at Object.<anonymous> (http://localhost:9000/scripts/vendor-bundle.js:26289:35)    at Object.execCb (http://localhost:9000/scripts/vendor-bundle.js:5508:33)    at Module.check (http://localhost:9000/scripts/vendor-bundle.js:4695:51)    at Module.enable (http://localhost:9000/scripts/vendor-bundle.js:4988:22)    at Object.enable (http://localhost:9000/scripts/vendor-bundle.js:5369:39)    at Module.<anonymous> (http://localhost:9000/scripts/vendor-bundle.js:4973:33)    at http://localhost:9000/scripts/vendor-bundle.js:3946:23    at each (http://localhost:9000/scripts/vendor-bundle.js:3871:31)    at Module.enable (http://localhost:9000/scripts/vendor-bundle.js:4925:17)    at Object.enable (http://localhost:9000/scripts/vendor-bundle.js:5369:39)    at Module.<anonymous> (http://localhost:9000/scripts/vendor-bundle.js:4973:33)    at http://localhost:9000/scripts/vendor-bundle.js:3946:23    at each (http://localhost:9000/scripts/vendor-bundle.js:3871:31)    at Module.enable (http://localhost:9000/scripts/vendor-bundle.js:4925:17)    at Module.init (http://localhost:9000/scripts/vendor-bundle.js:4600:26)    at http://localhost:9000/scripts/vendor-bundle.js:5272:36
printWarning @ bluebird.core.js:1417

• What is the expected behavior?
  I would like to add it to this repo

• What is the motivation / use case for changing the behavior?
  Like to show client comparison with kendoui grid.

While not critical as I do have slickgrid and aurelia-materialze-bridge working, I've been working with cli and would like to resolve if possible.

I'm submitting a bug report

• Library Version:
  current

Please tell us about your environment:

• Operating System:
  Windows 10

• Bundler used (WebPack/RequireJS/SystemJS
  WebPack

• Browser:
  all

• Language:
  TypeScript

Current behavior:
Demo page does not show the selected items in the multiple select editor under the prerequisites column. I am not sure if this is a prolem with the current version or the demo since I am not on the current version

Expected/desired behavior:

• What is the expected behavior?
  multiple select editor has the selected items checked when select list is opened

• What is the motivation / use case for changing the behavior?
  Demo page should behave as expected.

I'm submitting a bug report

Current behavior:
All SlickGrid called through EventDispatch should be cancelable, and this requirement is necessary for some of the subscribed event. The event that I currently have problem with is onBeforeEditCell and as answered by the author of SlickGrid in this SO, the way to cancel an edit is to return false which doesn't do anything when currently used with EventDispatch

Expected/desired behavior:

• What is the expected behavior?
  EventDispatch should be cancelable

• What is the motivation / use case for changing the behavior?
  Have the same behavior as regular SlickGrid subscribed event.

I'm submitting a bug report

• Bundler used (WebPack/RequireJS/SystemJS
  WebPack

• Browser:
  all

• Language:
  TypeScript

Current behavior:
Aurelia-Slickgrid mergeOptions function uses jQuery $.extend() and for some reasons the Grid Presets which before the merge has a valid array of objects, has the object replaced by a findOrDefault function.

Expected/desired behavior:

• What is the expected behavior?
  No error and no Array prototype function

I'm submitting a bug report

Current behavior:
in example3.ts if you add an onCellClick to either select editor's column definition (% Complete or Prerequisite), it removes autoEdit and you have to double click to show the editor. Also, the single or multiple select editor stay open when clicking on another cell

Expected/desired behavior:
autoEdit stays enabled and editor goes away when moving to another cell

• What is the motivation / use case for changing the behavior?
  I am doing advanced filtering in the select editor when the user clicks the cells. I want to change the columnDef.params.collection depending on the dataContext. I have not been able to figure out why these problems occur. Maybe the autoEdit turns off because of this line.

Example of what I am doing. I have a grid of roles below and a column for users. Each row's multipleSelectEditor's collection should be filtered by the role column value (called title in the screenshot) to show the available users. You can also see the problem

the logic:

    onCellClick: ({ columnDef, dataContext }) => {
      columnDef.params.collection = this.users.filter(c => c.roles.find(t =>
        dataContext.jobTitle && t.jobTitleName === dataContext.jobTitle.displayName));
    }

I'm submitting a bug report

• Browser:
  all
• Language:
  TypeScript

Current behavior:
The current Filter class has multiple properties like columnDef, callback, searchTerm, ... all of which are associated to the current column filter element. However the Filter Factory has a this.filters.find function which has a side effect of overwriting (or re-using) previous column filter. For example, let say column 1 and 4 are input filter, column 2 and 3 are select filter, then the current behavior of that column 1 will create a filter in the factory because it didn't find any but then when it comes back to the factory for column 4, it finds a filter and returns it but a new columnDef associated and column1 filter becomes out of sync (now it's columnDef is associated to column 4, so when I start typing in column 1 it tries to filter data against column 4.

Expected/desired behavior:

• What is the expected behavior?

• What is the motivation / use case for changing the behavior?
  I think this is a bad design from my side and Filter should be separated into 2 different classes, making something like ColumnFilter and ElementFilter classes were ElementFilter should only have the behavior of a DOM element (that one would stay with the Filter Factory) but the ColumnFilter class would have each columnDef and other related properties. This new issue was not there before the Filter Factory was introduced. I don't see this problem in Angular since I haven't put the Factory pattern in that repo yet and the previous code was creating a new instance on every filter element which is a difference compare to the Filter Factory which does a find().

For example, the first print screen below shows the columnDef before creating the filter and we can see it's associated to "percentComplete" but then it goes in the createFilter Factory, it finds a filterType and returns it but then that filter already has a columnDef associated to it, which is "Title". So now, when I start typing a filter in "percentComplete", it's actually trying to filter on "title"

Before creating the filter, it's columnDef is "percentComplete"

After creating the filter, it's now associated to columnDef of "title"

I'm submitting a bug report
Maybe this is a bug or maybe you did it by design

• Framework Version:
  current

Please tell us about your environment:

• Operating System:
  All

• Browser:
  all

• Language:
  TypeScript

Current behavior:
GridEventService passes grid and gridOptions, but gridOptions are out of date.

Expected/desired behavior:
gridOptions are up to date

• What is the expected behavior?

• What is the motivation / use case for changing the behavior?
  I was using attachOnClick in the GridEventService and notice you are passing the grid and gridOptions. However, if a property on the gridOptions are changed after AureliaSlickgridCustomElement initializes using grid.getOptions().fooBar = "new property", grid.getOptions() will not match gridOptions because that gridOptions are the original options used in the custom element. Slickgrid uses $.extend{} to create a copy of the gridOptions which is why these are out of sync

I know you are on vacation so don't respond to this :-). There is no rush, I just wanted to submit it as an issue/question before I forgot.

I'm submitting a feature request

Expected/desired behavior:

• What is the motivation / use case for changing the behavior?
  Have the same functionality Grouping & Aggregators that can be seen in the SlickGrid here

List of TODOs

• Recreate the Slick.Data.Aggregators as Aurelia Aggregators
• Make sure the Export to File works with/without Grouping and with/without Aggregators
• Create multiple groupTotalsFormatter
• Add multiple Formatters like DollarFormatter and/or CurrencyFormatter (with currency as prefix/suffix)
• From the SlickGrid example, which is the base of this work, try to replace dataView.setGrouping properties by Aurelia pieces as much as possible:
  • formatter: use regular Aurelia Formatters
  • comparer: use Aurelia Sorters
  • aggregators: use newly created Aurelia Aggregators
• Add Event Aggregators to Export Service, so user could add a spinner for example
• Add a Formatter sanitize html to text option in ExportService
• Add a column title option for the "Group By" column header title
• Create Wiki Pages and here it is

Hi,
I would like to set own page sizes for the grid.
In gridOptions I added parameters:

pagination: {
        pageSizes: [50, 100, 500],
        pageSize: 100,
        totalItems: 0
      }

In result I have got my sizes on the top of default (25,30,40,50,75,100).
Thanks for the help

I'm submitting a feature request

• Browser:
  all
• Language:
  all

Expected/desired behavior:

• What is the expected behavior?
  Provide Grid State Events so that the user can subscribe to them

I'm submitting a feature request

• Framework Version:
  Current

• Browser:
  all

• Language:
  TypeScript X.X

Current behavior:
the collectionFilterBy filters your collection for values not equal to the collectionFilterBy.value when operator is "EQ"

Expected/desired behavior:
Clarification, maybe documentation. I initially thought that if I passed 'Task2' in the collectionFilterBy.value (like in example 3), that the filter by service will filter for 'Task 2', but it seems the service "filters out" task 2 and shows everything else when the operator is "equal". Not sure if anyone else was confused by this, but I stumbled on it. First, i want to make sure this is not a bug and 2 if this is the design, I can add documentation that filter means filter out or exclude this value to potentially help others like me :-)

I'm submitting a feature request

• Framework Version:
  2.1.1

Please tell us about your environment:

• Operating System:
  Windows 10

• Bundler used (WebPack/RequireJS/SystemJS
  Webpack

• Browser:
  all
• Language:
  all

Current behavior:
Currently aurelia-slickgrid only supports OData v2/v3 (I'm not sure which), would be nice if v4 is also supported, since there are changes on the way that query is generated (new fields for instance).

Expected/desired behavior:
Support for OData v4 query standard for features that slickgrid provides, a parameter could be used to define which version of OData is desired or even adding a new service (and versioning the old one) using OData v4 standard for the grid-odata-service.ts, such as:

grid-odata-v3-service.ts
grid-odata-v4-service.ts
...

Check this for more information:

http://docs.oasis-open.org/odata/odata/v4.0/csprd02/part2-url-conventions/odata-v4.0-csprd02-part2-url-conventions.html

• What is the expected behavior?
  Currently if we use a OData v4 endpoint on server and aurelia-slickgrid, we get errors while filtering, because query constructed by current implementation differs.

Example of current generated query: $filter=(substringof('Ethel', Name))
Example of OData V4 expected query: $filter=contains(Name, 'Ethel')

• What is the motivation / use case for changing the behavior?
  Using Microsoft/Asp.NET Core implementation for OData does not allow me to switch to a previous OData specification, making this feature of the component only useful for old backend platforms on that ecosystem.

I'm submitting a bug report

• Framework Version:
  aurelia cli 0.27.0

Please tell us about your environment:

• Operating System:
  Windows 7 and also Ubuntu 16.04

• **Bundler used RequireJS

• Browser:
  Chrome
• Language:
  TypeScript

The problem is not directly with slickgrid. The problem is that when I add aurelia-slickgrid to the project dependencies, a plugin named aurelia-froala-editor is broken - it does not respond to mouse clicks at all.

This is just a tracker

• update all necessary Wikis
• finish Slider Filter
• finish Slider Editor (ref PR #80)
• Review Wiki mentioned in next paragraph

After Release

• Advertise Aurelia-Slickgrid on the Awesome Aurelia libraries list

This issue is to track each status on various tasks that will help contributing and documentation. As a result, hopefully it will attract more contributers who are interested in a free fast grid. These are not meant to be high priority tasks, but completing them will be helpful. This list is from the perspective of a new contributor (myself), so I apologize if I misstate something.

• Update CONTRIBUTING.md to your standards
  • The current one a copy of aurelia-skeleton-plugin
• Update ISSUES_TEMPLATE.md
  • When creating an issue there are references to Aurelia and BlueSpire
• Create CHANGELOG.md. in the docs directory - I can do this since I've done it in my projects
  • An example can be seen in the aurelia-skeleton-plugin. This is a good tracking mechanism and can help create release notes if there were a lot of changes for a release
  • Move Aurelia-wiki into docs
  • Replace conventional-changelog with standard-version per their recommendation
  • Add wiki entry for including/excluding 3 party libraries
• Remove Angular references. I understand that you juggle two very similar libraries, but it can be confusing when seeing angular references in an Aurelia library. An example is in the errors message of multipleSelectFilter, but there are others when I performed a search
• Reviewing and removing files that were either brought over from Aurelia skeleton's or not in use
  • Are the client-cli, client-ts-wp, doc directories in use? From looking at your package.json there are scripts that copy files to these directories, but I am unsure the purpose? My plan was to add the CHANGELOG.md to the doc directory, but there is a lot of other files in there that look similar to other directories.
  • client-ts-wp, Aurelia-project and examples directories error during npm run lint
• Add example for dependency injection in custom editors
• Add alternative example for dependency injection in custom formatters
• Unit Tests

EDIT: removing the unit testing task since that is such a larger task it needs it own issue tracker eventually

I'm submitting a feature request

Current behavior:
Since this is currently not available, user need to resolve collections before creating the grid

Expected/desired behavior:

• What is the expected behavior?
  Simply pass an http Promise to an async collection property and let it do it's job

• What is the motivation / use case for changing the behavior?
  Make it simpler to load asynchronously a collection and provide it to filter/editor without delaying the grid creation.

TODO

• Proof of Concept
• Add a JSON file to simulate real HttpClient call for collectionAsync
• Cleanup the code in MultipleSelectFilter
• Extract duplicate functions/code in MultipleSelectFilter, SingleSelectFilter & SelectFilter and create a shared utility file or class
• implement the same changes to the Editors MultipleSelectEditor, SingleSelectEditor
• update Editor Wiki & Filter Wiki

I'm submitting a bug report

• Library Version:
  \aurelia-slickgrid\client-cli
  node v10.15.0
  npm 6.4.1

• Operating System:
  Windows 10 Home

• Bundler used (WebPack/RequireJS/SystemJS
  client-cli

• Browser:
  Chrome

• Language:
  ESNext

Current behavior:
Command failed: C:\Program Files\Git\cmd\git.EXE checkout 4.0
npm ERR! error: pathspec '4.0' did not match any file(s) known to git.

Expected/desired behavior:
get npm install to work

• What is the expected behavior?
  found reference olefredrik/FoundationPress#1312
  and did the following
  had this issue as well, Changing package.json from "gulp": "github:gulpjs/gulp#4.0" to "gulp": "4.0" AND deleting my package-lock.json solved the issue.

The issue is the branch was deleted, for backwards compatibility can we keep the git branch active and maybe add a warning on postinstall?

• What is the motivation / use case for changing the behavior?
  To have demo working locally
  P.S. I tried to do the same for aurelia-slickgrid\doc\github-demo but got too many errors to report and happy to see cli working and thanks for your incredible contributions!

I'm submitting a bug report
Unless this is by design?

• Framework Version:
  1.13.0

• Browser:
  all

• Language:
  TypeScript

Current behavior:
An example is in the dateIsoFilterCondition, which will always filter for invalid dates as coded here. (if the date is invalid, the row will not be filtered). So when a user filters for a specific date they will always get a data item with a invalid value in the date

Expected/desired behavior:

• What is the expected behavior?
  invalid dates are filtered out of the result set

• What is the motivation / use case for changing the behavior?
  If there are a large number of NULL dates these will be included in the filter and the filter will seem broken to the user.

I'm submitting a feature request

Expected/desired behavior:

• What is the motivation / use case for changing the behavior?
  Extend the actual GridState Service to also provide Columns Width/Position/Visibility that user can save in Local Storage or DB which can later be re-used to recreate the grid in the exact same state as it was prior to closing the page.

This extends the previous issue #24 (now implemented) to create a GridState Service