I took a quick look. I may have missed something, but IMO, the "floating label" looks like it the same thing we call a "prompt" in Flex. There is a PromptBead in the FlexJS Basic set.
IMO, the prompt/label should not be tied to the "text" property of the TextInput. When I ran the example, the <label> did not have any string assigned to it. I would suggest adding either a PromptBead for MDL that sets a string in the <label> and/or adding a "prompt" or "floatingLabel" property to TextInput and using that to set the content of the <label>. HTH, -Alex On 10/25/16, 10:11 AM, "[email protected] on behalf of Carlos Rovira" <[email protected] on behalf of [email protected]> wrote: >Hi Alex, > >I upload latest changes to git, but still not working as expected. >If you want to check my MDLExample (App.mxml). There's 2 MDL TextInput. > >1.- Left TextInput is working as expected since if you change text, the >checkbox below changes text accordingly. > >2.- Right text input is not working as expected since it should has an MDL >floating text effect (as it's assigned) but is not working. Effect is like >the one in this page: >https://getmdl.io/components/index.html#textfields-section > >In my TextInput previous version (one previous commit ahead) change >handler >(left TI) was not working, but MDL flotating text effect was working. > >I need to get both, change handler and MDL effect to get a successful >implementation. > >I tried lots of things but with no luck. If you could watch this case, we >could get to the end of the problem. As you said is an important problem >since we'll need in more components to surround or decorate with >additional >tags to make other effects and styles without compromising default > functionality. > >Thanks > > > >2016-10-25 8:42 GMT+02:00 Alex Harui <[email protected]>: > >> Hi Carlos, >> >> I'm not sure we have other components with a different positioner than >> element, so you may be in new territory. I do want it to work, so it is >> hopefully just a matter of fixing bugs. >> >> How is are the div's missing class selectors specified? I think UIBase >> className is only set on the element. You may need to override that. >> >> HTH, I'm done for tonight. >> -Ale >> >> From: <[email protected]<mailto:[email protected]>> on >>behalf >> of Carlos Rovira >><[email protected]<mailto:[email protected]>> >> Date: Monday, October 24, 2016 at 11:04 PM >> To: Alex Harui <[email protected]<mailto:[email protected]>> >> Cc: "[email protected]<mailto:[email protected]>" >><[email protected] >> <mailto:[email protected]>> >> Subject: Re: [FlexJS] returning surrounding element in TextInput >> >> Hi Alex, >> >> this seems not work. I have this: >> >> element = input as WrappedHTMLElement; >> >> positioner = div as WrappedHTMLElement; >> positioner.style.position = 'relative'; >> (div as WrappedHTMLElement).flexjs_wrapper = this; >> (input as WrappedHTMLElement).flexjs_wrapper = this; >> (label as WrappedHTMLElement).flexjs_wrapper = this; >> element.flexjs_wrapper = this; >> >> >> In this way input change handler works, but MDL look is messed, this is >> the code generated, that is missing the first div class selectors: >> >> <div style="position: relative;"> >> <input type="text" class="mdl-textfield mdl-js-textfield >> mdl-textfield mdl-js-textfield" data-upgraded=",MaterialTextfield"> >> <label class="mdl-textfield__label"></label> >> </div> >> >> >> 2016-10-24 23:59 GMT+02:00 Alex Harui <[email protected]<mailto:aharu >> [email protected]>>: >> Try setting element as input and positioner as div. >> >> Sent from my LG G3, an AT&T 4G LTE smartphone >> >> ------ Original message------ >> From: Carlos Rovira >> Date: Mon, Oct 24, 2016 2:20 PM >> To: [email protected]<mailto:[email protected]>; >> Subject:[FlexJS] returning surrounding element in TextInput >> >> Hi, >> >> I'm subclassing TextInput (html) >> I need to create a div that surrounds the input. >> In html there is only input and that's the element returned. >> >> so my question is...how should I do to return the <div> with the <input> >> inside and makes the element points to the input (since the events and >> handlers depends of element (the input) to do work properly >> >> Until now I was returning the element as the surrounding div, but this >>end >> in malfunction of change event. >> >> Thanks. >> >> -- >> Carlos Rovira >> http://about.me/carlosrovira >> >> >> >> -- >> Carlos Rovira >> http://about.me/carlosrovira >> >> > > >-- >Carlos Rovira >http://about.me/carlosrovira
