Material-design-lite: Text field with icons

[mateeyow]

Is there a feature request for text fields with icons as stated here: http://material-design.storage.googleapis.com/publish/material_v_4/material_ext_publish/0B6Okdz75tqQsbGg3SklJUjNGSHc/components_textfields_single2.png

[surma]

I don’t think this calls for a separate component. Our current support for icons and textfields should already apply to this use-case or am I missing something?

[mateeyow]

Hmmm. Your example only has the expandable and the design spec has a specific spec for it. http://material-design.storage.googleapis.com/publish/material_v_4/material_ext_publish/0Bx4BSt6jniD7S2NCRjNkZk9SVkU/components_textfields_single7.png

[surma]

You have a point, we don’t support propagating the active state to the icon.

For now you’d have to do something like

<i class="material-icons">phone</i>
<div class="mdl-textfield mdl-js-textfield textfield-demo">
  <input class="mdl-textfield__input" type="text" id="sample1" />
  <label class="mdl-textfield__label" for="sample1">Phone number</label>
</div>

[mateeyow]

Okay. Thanks a lot. :+1: :smile:

[jfily]

I've done something similar you may use : http://codepen.io/jfily/pen/epWyBa

[nileshmax]

Hello,
Similar problem, I wanted to do this, what is right way to do this.

[traviskaufman]

We will have a solution for this in v2: see #4479

We are still in the very early stages of v2 and are currently working towards an alpha. Our master branch is where all v2 work is happening if you are interested in keeping up with its progress. 😄