Simple Form: Is it possible to remove labels and replace them with placeholders using the labels i18n? [duplicate]

Question

This question already has answers here:

How to use placeholders instead of labels in simple_form? (4 answers)

Closed 4 years ago.

I'm trying to produce a regular simpleform form

= simple_form_for [:hq, @team, @order] do |f|
  .tickets
    = f.select :tickets, :aaa => "aaa"
    = render "ticket"


  .details
    .left
      = f.input :address1
      = f.input :address2
      = f.input :state
      = f.input :country
      = f.input :email
    .right
      = f.input :comments

But I want the inputs to not be rendered with a label, just the title "Address Line 1" in the placeholder.

I know I can do this with f.input :address1, :placeholder => "whatever", :label => "" but I'd like it to be configurable with a wrapper and take the i18n value form label, not placeholder.

Answer 1

Try doing the following:

f.input :address1, placeholder: "Address Line 1", label: false

Answer 2

If you want to use javascript, here is a jQuery snippet that does the job:

$.each($(".left .input"), function() {
  var label = $("label",$(this)).text();
  $("label",$(this)).hide();
  $("input",$(this)).attr("placeholder",label);
});

The main advantage using js for this case is that the result remains screen-readers compliant (they will read the label because they won't run the js).