16

I've been muddling around with Polymer 1.0 since its release, and I've hit a use case where a select list just won't be sufficient (too many options to select from). What I really need is an autocomplete textbox.

Is there one built-in or planned in the paper or iron Polymer controls? Or should I be looking at autocomplete solutions from other frameworks? So far, I've been able to keep my app light-weight, and I'd prefer to avoid other frameworks if I can help it.

Thanks,

Ryan

Edit: The best place I've seen to bring up a first-party developed autocomplete is on the PolymerElements/paper-elements repo on GitHub. I'd discuss at https://github.com/PolymerElements/paper-elements/issues/26.

Ryan Nigro
  • 4,389
  • 2
  • 17
  • 23

2 Answers2

3

Vaadin's combo box looks pretty solid:

Vaadin combo box

There is also Ellipticaljs's Paper Autocomplete, with a possible alternative md-autocomplete in the works.

paper-autocomplete

You can find more autocomplete elements by searching at http://customelements.io.

Dan Dascalescu
  • 143,271
  • 52
  • 317
  • 404
0

For now, I've settled on using HTML5 datalists in conjunction with a modified <paper-input> control (I've submitted a pull request to the Github repo to merge those changes back into the master branch). All those changes do is persist the list attribute to the inner <iron-input> control so that it can utilize an HTML5 datalist.

Definitely not ideal, but, in the short-term, it'll function as a placeholder in place of a real typeahead control.

I also built a quick custom validator that iterates over the same Array collection as what I use in my datalist so that the <paper-input> control knows if the current value is a selectable (valid) value or not.

Edit: The best place I've seen to bring up a first-party developed autocomplete is on the PolymerElements/paper-elements repo on GitHub. I'd discuss at https://github.com/PolymerElements/paper-elements/issues/26.

Ryan Nigro
  • 4,389
  • 2
  • 17
  • 23
  • I can only find this fork https://github.com/RNCRyan/paper-input/commit/c880ae9594ff7b1b0e3397f7e579979797fd0e6f. But it only allows list (which is implemented in 1.0.6) – vinyll Jul 15 '15 at 14:41
  • Yep, I did a pull request to get the "list" attribute on the core paper-input GitHub project. "list" is an attribute on the github.com/PolymerElements/paper-input project as of 1.0.5 or 1.0.6. – Ryan Nigro Jul 15 '15 at 17:31