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, "carlos.rov...@gmail.com on behalf of Carlos Rovira" <carlos.rov...@gmail.com on behalf of carlosrov...@apache.org> 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 <aha...@adobe.com>: > >> 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: <carlos.rov...@gmail.com<mailto:carlos.rov...@gmail.com>> on >>behalf >> of Carlos Rovira >><carlosrov...@apache.org<mailto:carlosrov...@apache.org>> >> Date: Monday, October 24, 2016 at 11:04 PM >> To: Alex Harui <aha...@adobe.com<mailto:aha...@adobe.com>> >> Cc: "dev@flex.apache.org<mailto:dev@flex.apache.org>" >><dev@flex.apache.org >> <mailto:dev@flex.apache.org>> >> 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 <aha...@adobe.com<mailto:aharu >> i...@adobe.com>>: >> 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: dev@flex.apache.org<mailto:dev@flex.apache.org>; >> 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
