flex-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Alex Harui <aha...@adobe.com>
Subject Re: [FlexJS] returning surrounding element in TextInput
Date Tue, 25 Oct 2016 18:28:40 GMT
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.rovira@gmail.com on behalf of Carlos
Rovira" <carlos.rovira@gmail.com on behalf of carlosrovira@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 <aharui@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.rovira@gmail.com<mailto:carlos.rovira@gmail.com>> on
>>behalf
>> of Carlos Rovira
>><carlosrovira@apache.org<mailto:carlosrovira@apache.org>>
>> Date: Monday, October 24, 2016 at 11:04 PM
>> To: Alex Harui <aharui@adobe.com<mailto:aharui@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 <aharui@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

Mime
View raw message