Rails: Active Admin Association Image column
Asked Answered
S

2

9

I am new to ruby on rails and have just installed active admin and was trying to customize the

views.

I have a product and image table. Each image belongs to one product.

Now I want to display a column with the associated image when showing the products page.

At the moment it´s only the image_url text which isn´t working. Later on I would like do

have the picture displayed in 50x50px.

How to I do this? (image model: name:string image_url:text)

Here is what I have done :

ActiveAdmin.register Product do

index do
    column "Image" do |image|
        image.image_url
    end
    column :name
    column :preview_text
    column :full_text
    column :price, :sortable => :price do |product|
      div :class => "price" do
          number_to_currency product.price
     end
    end
 default_actions
 end
end

I dont know how to fix that part with " do image. I am a beginner in rails 2 days exp..

It seems the syntax is wrong and throwing error:

undefined method `image_url' for #<Product:0x00000101b5a458>

Thanks

Stall answered 19/5, 2013 at 23:4 Comment(0)
O
18

You need to get the image_url from the image object product.image.image_url.

Regarding the image size, you can display the image with the size you want, like so

column "Image" do |product|
  image_tag product.image.image_url, class: 'my_image_size'
end

.css

.my_image_size {
  width: 50px;
  height: 50px;
}

Or you can actually resize the image itself, with a gem such as CarrierWave.

Ona answered 19/5, 2013 at 23:14 Comment(1)
or you can just do image_tag product.image.image_url, size: "50x50" without needing to deal with css.Melee
F
1
column "Image" do |product|
  image_tag (product.image,width:100,height:80) 
end


references
image=it's belongs to your database column name
product=it creates new object for your image by activeadmin register class method.
Flieger answered 14/5, 2017 at 14:6 Comment(1)
You should add some explanations. It is always appreciated... ;)Stokes

© 2022 - 2024 — McMap. All rights reserved.