spoonx / aurelia-autocomplete Goto Github PK

• #52

CC @Mobe91

Tag is 3.0.0-2

Hi there,

I'm binding a property onto selected and decorating it as observable, but my change event never gets called. I'm thinking that selected isn't being set correctly?

Cheers,

Are there plans to support multiple selected values as Select2 does? Or is that supported already and I missed it?

Thank you
Thomas

When an autocomplete is supplied with items and with an initial selection, the items matching the initial selection are uncollapsed after the component is created because hasFocues is set to true in valueChanged().

<auto-complete result.bind="mySelection" items.bind="myOptions"></auto-complete>

autocomplete.js:70 Uncaught TypeError: this.dropdownToggle.dropdown is not a function
at AutoCompleteCustomElement.showDropdown (autocomplete.js:70)
at AutoCompleteCustomElement.handleKeyDown (autocomplete.js:222)
at CallScope.evaluate (aurelia-binding.js:1517)
at Listener.callSource (aurelia-binding.js:5232)
at Listener.handleEvent (aurelia-binding.js:5241)

This occurs when there are results in the dropdown and I am changing using backspace or space

Not sure if this a issue or a question. I have already asked this question on SO, which is as below. I am posting this here as I have not yet received any answer for the question. If you think this is not a real issue, then please close this one. It would really great if you please provide an answer/work-around either here or in SO.

I am trying to use aurelia-autocomplete in my project (based on Webpack), without other aurelia packages from SpoonX.

Though it works correctly on run time, during build it throws the below error.

[at-loader] ./node_modules/aurelia-autocomplete/dist/aurelia-autocomplete.d.ts:13:1
TS1128: Declaration or statement expected.
[at-loader] ./node_modules/aurelia-autocomplete/dist/aurelia-autocomplete.d.ts:13:16
TS1005: ';' expected.
[at-loader] ./node_modules/aurelia-autocomplete/dist/aurelia-autocomplete.d.ts:15:8
TS1005: ';' expected.
[at-loader] ./node_modules/aurelia-autocomplete/dist/aurelia-autocomplete.d.ts:17:1
TS1128: Declaration or statement expected.
[at-loader] ./node_modules/aurelia-autocomplete/dist/aurelia-autocomplete.d.ts:17:16
TS1005: ';' expected.
[at-loader] ./node_modules/aurelia-autocomplete/dist/aurelia-autocomplete.d.ts:13:8
TS2304: Cannot find name 'declare'.
[at-loader] ./node_modules/aurelia-autocomplete/dist/aurelia-autocomplete.d.ts:15:3
TS2304: Cannot find name 'from'.
[at-loader] ./node_modules/aurelia-autocomplete/dist/aurelia-autocomplete.d.ts:17:8
TS2304: Cannot find name 'declare'.
[at-loader] ./node_modules/aurelia-autocomplete/dist/aurelia-autocomplete.d.ts:18:3
TS2304: Cannot find name 'logger'.

My Visual Studio Code also shows the error in aurelia-autocomplete.d.ts.

Of course the errors disappear when I comment the problematic exports. Also the notation/syntax for those exports are slightly confusing for me, especially when the class AutoCompleteCustomElement is exported below (refer the last line of the screenshot).

Is there any way around this error?

Hi, I'm relatively new to Aurelia, and I'm working on a project where I'm going to use aurelia-autocomplete. I've got it (mostly) working, but I could use some help with a couple of things:

Can you provide an example of how to configure the plugin to use the bootstrap4 html file? I've got the plugin configured in my main.js, but I don't know how to add the option there.

Also, I have been trying to figure out how to watch for changes to the value (which is bound to a child of an object). I tried to use footerSelected, but I haven't had any success with it. If you have an example of that, it would be helpful if I could see how to use it.

Thanks!

Hi,
I couldn't find Aurelia-autocomplete on NPM. Could you please put it there as well?

If installing using the Aurelia cli, I'm getting 4 "File not found or not accessible" errors when trying to run.

Hi there,

Wondering if it is possible to use the Enter key to select an element from the drop down? I can't seem to find anything in the docs.

Cheers,

The current autocomplete.html template is for Bootstrap 3 and doesn't work with Bootstrap 4. Can I override the location of the template, so I can use a different one? I feel that it needs to be done via aurelia-view-manager configuration, but I can not figure out where and how it should be done. I'm using Aurelia-CLI if it's matter.

On Safari macOS, clicking an option closes the autocomplete, but doesn't select the value. The <input>'s onBlur prevents the onSelect from being triggered.

https://github.com/SpoonX/aurelia-autocomplete/blob/master/src/component/autocomplete.js#L454

    let query = {
      populate: this.populate || 'null',
      where   : mergedWhere
    };

If populate is 'null', the request will include populate=null.
Defaulting it to an empty array will leave out the populate property in the request.

Hi, I'm trying to override the searchQuery method which i see according to the documentation is possible, but I can't figure out how. For now I just modified the autocomplete.js in the jspm folder AutoCompleteCustomElement.prototype.searchQuery function though I know it is a bad practice

Hi,

I installed the package using npm, and there are some problems:

1. default installation has no dist/amd folder structure and when you add just "aurelia-autocomplete" to dependencies it looks for aurelia-autocomplete\dist\amd\aurelia-autocomplete.js . It's not there, it's under the folder "src".
2. I then changed the dependency signature to
   {
   "name": "aurelia-autocomplete",
   "path": "../node_modules/aurelia-autocomplete/src",
   "main": "aurelia-autocomplete"
   }
   but then it complains as the following:

COULD NOT CONVERT: C:/Users/eertu/Source/Workspaces/Encumen/Encumen/src/Encumen.Web.Client/node_modules/aurelia-autocomplete/src/aurelia-autocomplete.js, so skipping it. Error was: Error: Line 8: Unexpected token
{ uid: 8,
name: 'writeBundles',
branch: false,
error:
Error: Parse error using esprima for file: C:/Users/eertu/Source/Workspaces/Encumen/Encumen/src/Encumen.Web.Client/node_modules/aurelia-autocomplete/src/aurelia-autocomplete.js
Error: Line 8: Unexpected token
at Object.context.load (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:379:19)
at Object.load (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :832:29)
at Object.fetch (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :822:66)
at Object.check (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :854:30)
at Object.enable (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :1173:22)
at Object.enable (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :1554:39)
at Object.context.enable (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:289:24)
at Object.eval (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :1158:33)
at eval (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :134:23)
at each (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :59:31),
duration: [ 12, 890126996 ],
time: 1484042984775 }
{ uid: 0,
name: '',
branch: true,
error:
Error: Parse error using esprima for file: C:/Users/eertu/Source/Workspaces/Encumen/Encumen/src/Encumen.Web.Client/node_modules/aurelia-autocomplete/src/aurelia-autocomplete.js
Error: Line 8: Unexpected token
at Object.context.load (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:379:19)
at Object.load (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :832:29)
at Object.fetch (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :822:66)
at Object.check (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :854:30)
at Object.enable (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :1173:22)
at Object.enable (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :1554:39)
at Object.context.enable (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:289:24)
at Object.eval (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :1158:33)
at eval (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :134:23)
at each (eval at (C:\Users\eertu\Source\Workspaces\Encumen\Encumen\src\Encumen.Web.Client\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:9), :59:31),
duration: [ 15, 93924911 ],
time: 1484042984789 }

Hi all,
I started working with aurelia-autocomplete. but i got stuck in initial setting up steps.
versions available at my desk are:

1. node - v8.11.1
2. npm - 5.6.0
3. aurelia - 0.33.1

Steps followed by me to add aurelia-autocomplete plugin

1. au new -> project with typescript and webpack
2. npm install aurelia-autocomplete --save
3. npm install --save
4. adding plugin in main.ts by .plugin(PLATFORM.moduleName('aurelia-autocomplete'))
5. au run --watch
6. browser refresh - No "Hello world!"

on console in browser getting error - Unhandled rejection Error: Unable to find module with ID: aurelia-autocomplete/component/autocomplete

No error on node terminal

Please help to get started with aurelia-autocomplete

Thanks in advance

Recommend providing a simplest use-case in beginning documentation. Detailed use-case you've provided is excellent. See twitter typeahead examples.

Uncaught (in promise) ReferenceError: promise is not defined

Looks like promise actually doesn't exist here:
https://github.com/SpoonX/aurelia-autocomplete/blob/master/src/component/autocomplete.js#L246

I am currently applying some modifications to the component so that it works with bootstrap 4 and I would like to contribute this. How do you want to go about supporting both bs3 and bs4?

I am using version 2.2.3 of aurelia-autocomplete and cannot specify minInput - it constantly evaluates to 0 in hasEnoughCharacters. I have tried:

<auto-complete ... minInput.bind="minInput"></auto-complete>

with a corresponding field minInput set to 1 in my controller class and

<auto-complete ... minInput="1"></auto-complete>

No idea if this is a bug or if I am doing anything wrong.

When I change the value bound to the autocomplete's result attribute from my view controller, the change is not reflected in the view, i.e. the old selection is displayed.

Following scenario:

1. Autocomplete input has no focus
2. User marks content in input, i.e. a mousedown followed by a mouseup but the mouseup happens outside of the input - hence no click event is triggered that uncollapses the bootstrap dropdown
3. The user then begins typing but the dropdown is not shown although there are results to display

Hey there, thanks for creating this. I am trying to get it running and I am using the webpack version. I've installed it via npm and have the following in my main file.

aurelia.use.plugin(PLATFORM.moduleName('aurelia-autocomplete'));

But then this error happens:

Any ideas or experience?

Hi, first of all thanks for this awesome component, I'm having an issue with the autocomplete, I have a fixed set of items in an array, but every time the page loads, it always show de dropdown with no items like this:

this is my code:
html

...
<auto-complete items.bind="skills" value.two-way="skill" placeholder="Enter Skill" limit="10" ></auto-complete>
...

js

export class testComponent {
  constructor(config, router) {
    this.skills = ['Painting', 'Programing'];
  }
}

Any ideas to fix this?

Thanks!