32

I have a edit form in Active Admin. I need some field as read only.

My current edit page is like

enter image description here

I need the page look like this

enter image description here

How can this be done. My code for the edit form page is like

    form :html => { :enctype => "multipart/form-data" } do |f|  
      f.inputs "Users" do
        f.input :device, :label => 'Device', :as => :select, :collection => DEVICE, :include_blank => false
        f.input :current_address, :label => 'Current Address', :as => :string
      end
    end

Please help.

Charles
  • 50,943
  • 13
  • 104
  • 142
Amal Kumar S
  • 15,555
  • 19
  • 56
  • 88
  • actually what i did is I added disabled => true, I see the disabled text box. I styled the background of the text box to match the page color. So it looks like what I need. but that's not the correct way :( – Amal Kumar S Oct 15 '12 at 15:51
  • It's a pity, it could be good option – Fivell Oct 16 '12 at 13:23

6 Answers6

53

As Alex said, set to disabled. You could then use css to get the visual you wanted, if you can live with the semantics of that.

The syntax was slightly different for me to get this to work.

in your admin form:

 f.input :finish_position, input_html: { disabled: true } 

in your CSS active_admin.css

input[disabled="disabled"],
input[disabled] {
  background-color: #F4F4F4;
  border: 0px solid #F4F4F4 !important;  
}
Abram
  • 39,950
  • 26
  • 134
  • 184
Will
  • 4,498
  • 2
  • 38
  • 65
  • 1
    THX a lot @Will I did a small change to the css to emphasize the idea of a disabled "field": I've substituted `border: 0px solid #F4F4F4 !important;` with `cursor: not-allowed;` – microspino Aug 08 '17 at 08:41
14

For a cleaner form definition within your ActiveAdmin.register{} block you may as well want to define a "readonly" input type to be used within active admin using formtastic:

Form block syntax is for activeadmin version 1.0.0.pre at 0becbef0918a.

# app/admin/inputs/readonly_input.rb

class ReadonlyInput < Formtastic::Inputs::StringInput
  def to_html
    input_wrapping do
      label_html <<
      template.content_tag('div', @object.send(method))
    end
  end
end

# app/admin/your_model.rb

ActiveAdmin.register YourModel do
  # ...

  form do |f|
    # ...

    input :current_address, as: :readonly

    # ...
  end  
end
David
  • 149
  • 1
  • 4
10

I was facing the same issue and tried using :disabled but it did not solve my problem as I wanted field value to be included in params object while sending it to the server. When you mark a form input as :input_html => {:disabled => true} , it does not include this field value in params. So, instead I used :input_html => {:readonly => true} which solved both of my problems:

  1. Does not allow user to edit
  2. Includes the value in params

I hope this will help.

Rinku
  • 1,078
  • 6
  • 11
Rahul Goyal
  • 644
  • 1
  • 8
  • 19
4

How about this?

form :html => { :enctype => "multipart/form-data" } do |f|  
  f.inputs "Users" do
    f.input :device, :label => 'Device', :as => :select, :collection => DEVICE, :include_blank => false
    f.li do
      f.label :current_address
      f.span f.object.current_address
    end
  end
end
deraru
  • 41
  • 1
2

Try to add , :disabled => true for address input field.

alex
  • 3,682
  • 3
  • 21
  • 22
  • when I add :disabled => ture I can see the textbox there, and it wont be editable. Actually I dont wan't any textbox there. – Amal Kumar S Oct 03 '12 at 09:52
0

The trick is to use "object". Here is how you should code it:

form :html => { :enctype => "multipart/form-data" } do |f|  
  f.inputs "Users" do
    f.input :device, :label => 'Device', :as => :select, :collection => DEVICE, :include_blank => false
    f.label :current_address, f.object.current_address
  end
end
mshasib
  • 11
  • 1