Are there any built in auto-complete input components for Polymer 1.0? [closed]
Asked Answered
D

2

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.

Disfranchise answered 9/6, 2015 at 16:56 Comment(0)
D
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.

Disfranchise answered 12/6, 2015 at 12:55 Comment(2)
I can only find this fork github.com/RNCRyan/paper-input/commit/…. But it only allows list (which is implemented in 1.0.6)Af
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.Disfranchise
P
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.

Pannier answered 1/3, 2016 at 18:40 Comment(0)
D
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.

Disfranchise answered 12/6, 2015 at 12:55 Comment(2)
I can only find this fork github.com/RNCRyan/paper-input/commit/…. But it only allows list (which is implemented in 1.0.6)Af
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.Disfranchise

© 2022 - 2024 — McMap. All rights reserved.