LeaVerou / awesomplete

Ultra lightweight, usable, beautiful autocomplete with zero dependencies.
http://leaverou.github.io/awesomplete/
MIT License
6.96k stars 611 forks source link

Using Awesomplete within Polymer.js Template, within Custom Element #16737

Open landmaxcanada opened 9 years ago

landmaxcanada commented 9 years ago

Hi, I am new to Polymer and would like to use Awesomplete with a custom Polymer Element. So far I have tried adding references to the "input" and "datalist" by adding them to the global namespace in the Polymer domReady event:

//lm is a global object domReady: function() { lm.input = this.$.myinput; lm.mylist = this.$.mylist; new Awesomplete(lm.input, { list: lm.mylist }); }

And I get this error: Uncaught TypeError: Cannot read property 'length' of undefined_.evaluate @ awesomplete.js:217

Other clues: the dom is getting modified by the script but the css is not, probably since it cannot reach into the shadow dom.

erquhart commented 9 years ago

Have you attempted any debugging?

Janghou commented 8 years ago

Remove any data-list attribute on your input element You'll have this error with a data-list attribute set to a string (bogus selector):

 In case of conflict (...), the HTML attribute wins. 

Anyhow probably not an awesomplete issue.