Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

floatPlaceholder="auto" or any other input doesn't show placeholder text #3246

Closed
xtianus79 opened this issue Feb 22, 2017 · 8 comments
Closed

floatPlaceholder="auto" or any other input doesn't show placeholder text #3246

xtianus79 opened this issue Feb 22, 2017 · 8 comments
Labels
cannot reproduce The team is unable to reproduce this issue with the information provided

Comments

@xtianus79
Copy link

Bug, feature request, or proposal:

Bug

What is the expected behavior?

the input with some variation should show placeholder text and it will float above once typing into.

What is the current behavior?

the inpu area never shows placeholder text

What are the steps to reproduce?

floatPlaceholder="auto" i use this | never or | always and the placeholder text never is in the initial input

Providing a Plunker (or similar) is the best way to get the team to see your issue.
I have provided a plunkr which works as intended...

http://plnkr.co/edit/sNfQGZ4yRXnLaureGCbl?p=preview

But this is not how it is working in development. I went through the process of removing all of my css to assure nothing was conflicting with it... It is still broken. As well, i installed it on a fresh starter package and the same thing occurs.

Which versions of Angular, Material, OS, browsers are affected?

"@angular/common": "~2.4.8",
"@angular/compiler": "~2.4.8",
"@angular/core": "~2.4.8",
"@angular/forms": "~2.4.8",
"@angular/http": "~2.4.8",
"@angular/material": "^2.0.0-beta.2",

Is there anything else we should know?

These last changes to material where a lot of breaking changes... and some of them seemed very unnecessary such as going from md to mat... :( sorry just providing feedback.
also, is anyone concerned that Angular 4 will be released prior to angular material 2 being finished? How will this be handled with Angular 4. Will material just work with ongoing angular versions?
@willshowell
Copy link
Contributor

If I understand correctly, the plunker you've linked is showing correct behavior.

Do you think you could provide a plunker that demonstrates the incorrect behavior? Or link to the fresh starter repo that has the same problem?

@kara
Copy link
Contributor

kara commented Feb 22, 2017

Yeah, this is difficult for us to look into if all we have is a working example. Please provide something we can use to reproduce or we will need to close the issue.

To address your other question, the mat- change was necessary to support apps upgrading from AngularJS Material to Angular Material. Apologies if this reason was not well communicated.

@kara kara added the cannot reproduce The team is unable to reproduce this issue with the information provided label Feb 22, 2017
@crisbeto
Copy link
Member

Sounds like it could be related to #3196.

@xtianus79
Copy link
Author

hey @willshowell and @kara I will find a quick start and add it in there so there is something to see. ... one of my go to setups is the quickstart finished build that was but now that is gone (i wish you all would put both the seed and end build quickstart repo back.)

@willshowell
Copy link
Contributor

@xtianus79 be sure to check out #3196 as @crisbeto mentioned. You need to have
<!DOCTYPE html> in your index.html.

You can see that, if you remove that line from the plunker, the placeholders break in the same way you mentioned in your original comment.

@xtianus79
Copy link
Author

@willshowell @crisbeto lol yes that was exactly it. That wasn't in there. Thanks!!!

@xtianus79
Copy link
Author

@willshowell @crisbeto one thing that adds to the confusion is that in the documentation you guys aren't using the new api standards...

    <form class="example-form">
  <md-input-container class="example-full-width">
    <input mdInput placeholder="Company (disabled)" disabled value="Google">
  </md-input-container>

  <table class="example-full-width" cellspacing="0"><tr>
    <td><md-input-container class="example-full-width">
      <input mdInput placeholder="First name">
    </md-input-container></td>
    <td><md-input-container class="example-full-width">
      <input mdInput placeholder="Long Last Name That Will Be Truncated">
    </md-input-container></td>
  </tr></table>

  <p>
    <md-input-container class="example-full-width">
      <textarea mdInput placeholder="Address">1600 Amphitheatre Pkwy</textarea>
   </md-input-container>
    <md-input-container class="example-full-width">
  <textarea mdInput placeholder="Address 2"></textarea>
        </md-input-container>
 </p>

 <table class="example-full-width" cellspacing="0"><tr>
   <td><md-input-container class="example-full-width">
     <input mdInput placeholder="City">
   </md-input-container></td>
   <td><md-input-container class="example-full-width">
     <input mdInput placeholder="State">
   </md-input-container></td>
   <td><md-input-container class="example-full-width">
     <input mdInput #postalCode maxlength="5" placeholder="Postal Code" value="94043">
     <md-hint align="end">{{postalCode.value.length}} / 5</md-hint>
   </md-input-container></td>
</tr></table>
</form>

@willshowell willshowell mentioned this issue Mar 10, 2017
Merged
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 5, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
cannot reproduce The team is unable to reproduce this issue with the information provided
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@kara @crisbeto @willshowell @xtianus79