pryley / float-labels.js

A zero-dependency plugin that applies the float label pattern to a form.
https://pryley.github.io/float-labels.js/
MIT License
88 stars 22 forks source link

Does not work when passed form element. #11

Closed raysuelzer closed 6 years ago

raysuelzer commented 6 years ago

The code seems to choke on text nodes.

To reproduce, attempt to pass native element which includes text nodes (any white space).

pryley commented 6 years ago

Would you please provide a small example?

raysuelzer commented 6 years ago

I'm closing this because I think it has to do with angular's nativeElement.

raysuelzer commented 6 years ago

I am going to reopen this issue because I was able to narrow it down a bit more and provide an example.

When using document.getElementByid the line if( !NodeList.prototype.isPrototypeOf( this.el ))return; will exit. It would be nice be able to pass in a DOM element. I can work on this if you would like?

Example: https://plnkr.co/edit/p5WwkE8bMKuXsPBghohs?p=preview

raysuelzer commented 6 years ago

A change like this allows it accept a single element

this.el = this.isString( el ) ? document.querySelectorAll( el ) : [el]; // wrap el in an array so it can be looped
//  if( !NodeList.prototype.isPrototypeOf( this.el ))return;  Remove this check, or do another check that doesn't return if the element is is not a NodeList