Ruby on Rails: Wie füge ich einem f.text_field Platzhaltertext hinzu?

144

Wie kann ich placeholdermeinen f.text_fieldFeldern Text hinzufügen , sodass der Text standardmäßig vorab geschrieben wird. Wenn ein Benutzer in die Felder klickt, wird der Text ausgeblendet, sodass der Benutzer den neuen Text eingeben kann.

ruby-on-rails

— NullVoxPopuli
quelle

HTML5 unterstützt dies. In der Zwischenzeit gibt es Javascript-Lösungen .

— Ghoppe

3

Ich schlage vor, nslocums Antwort anstelle meiner hinzuzufügen. Sein ist korrekt für Rails 3.

— Chuck Callebs

269

Mit Schienen> = 3.0 können Sie einfach die placeholderOption verwenden.

f.text_field :attr, placeholder: "placeholder text"

— nslocum
quelle

4

Das Attribut "Platzhalter" wird nur von HTML5 unterstützt, das Browser unterstützt, wobei Browser wie Internet Explorer weggelassen werden.

— Travis-146

1

Die korrekte URL für jQuery Fix ist hagenburger.net/BLOG/…

— szeryf

1

@ KDP: Es scheint das gleiche in Rails 2 zu sein, obwohl Sie möglicherweise die alte Attributsyntax benötigen:f.text_field :attr, :placeholder => "placeholder text"

— mwfearnley

Ist es möglich, einen langen Text - möglicherweise als separate HTML-Datei - als Platzhalter hinzuzufügen? Ich versuche, eine Vorlage für Benutzer bereitzustellen, in die sie ihren Inhalt schreiben können.

— sofarsophie

32

In Rails 4 (mit HAML):

=f.text_field :first_name, class: 'form-control', autofocus: true, placeholder: 'First Name'

— Zoltan
quelle

15

Für Benutzer von Rails (4.2) Internationalisierung (I18n):

Setzen Sie das Platzhalterattribut auf true:

f.text_field :attr, placeholder: true

und in Ihrer lokalen Datei (dh en.yml):

en:
  helpers:
    placeholder:
      model_name:
        attr: "some placeholder text"

— cweston
quelle

Danke, das hat funktioniert. Ich habe das nicht eingestellt placeholder: true. Nachdem Sie das so eingestellt haben, wie Sie es beschrieben haben, hat es funktioniert.

— Hendrik

2

Hier ist eine viel sauberere Syntax, wenn Sie verwenden rails 4+

<%= f.text_field :attr, placeholder: "placeholder text" %>

So rails 4+kann nun diese Syntax verwendet anstelle der Hash - Syntax

— Abhilash
quelle

1

Wie unterscheidet es sich von der akzeptierten @ nslocum-Antwort?

— Mlt

@mlt Die akzeptierte Antwort wurde nach Bereitstellung dieser Antwort auf ähnlich aktualisiert.

— Abhilash

2

Ich habe die obigen Lösungen ausprobiert und es sieht aus wie auf Schienen 5. * Das zweite Argument ist standardmäßig der Wert des Eingabeformulars. Was für mich funktioniert hat, war:

text_field_tag :attr, "", placeholder: "placeholder text"

— Prosper Opara
quelle

1

Legen Sie in Ihrer Ansichtsvorlage einen Standardwert fest:

f.text_field :password, :value => "password"

In Ihrem Javascript (unter der Annahme, dass hier abgefragt wird):

$(document).ready(function() {
  //add a handler to remove the text
});

— Jed Schneider
quelle

1

Das Suchfeld der Huffington Post verwendet dieses JS-Bit im Eingabeelement: onfocus="if(this.value=='Search The Huffington Post')this.value=''" value="Search The Huffington Post"Scheint ein guter Ansatz zu sein.

— Nathan