How to put images into an array Ruby on Rails

Question

I have a Ruby on Rails app that allows a user to save up to 6 images that can then be viewed in a carousel.

The images are saved as strings as image, image_2, image_3, image_4, image_5, image_6.

I want to be able to write a 'for' loop to display all of the images in my carousel.

What is the best method of combining all of these image strings into an array so that they can then be looped through and outputted by the carousel?

Further Details

I am currently calling the images like below which works but isn't particularly DRY.

<div style="position:relative">
  <div id="home-carousel" class="carousel">
    <div class="carousel-inner">

      <div class="item active">
        <%= image_tag @place.image %>
      </div>

      <% if @place.image_2.present? %>
        <div class="item">
          <%= image_tag @place.image_2 %>
        </div>
      <% end %>

      <% if @place.image_3.present? %>
        <div class="item">
          <%= image_tag @place.image_3 %>
        </div>
      <% end %>

      <% if @place.image_4.present? %>
        <div class="item">
          <%= image_tag @place.image_4 %>
        </div>
      <% end %>

      <% if @place.image_5.present? %>
        <div class="item">
          <%= image_tag @place.image_5 %>
        </div> 
      <% end %>

      <% if @place.image_6.present? %>  
        <div class="item">
          <%= image_tag @place.image_6 %>
        </div>
      <% end %>

    </div>
  </div>
</div>

I would like to be able to turn what I have below into a simple for loop that will go through each of the 6 image objects and return the ones that are there. Something more like this:

<div style="position:relative">
  <div id="home-carousel" class="carousel">
    <div class="carousel-inner">
      <% @place.images.each do |image| %>
        <div class="item">
          <%= image_tag image %>
        </div>
      <% end %>
    </div>
  </div>
</div>

When you mention image "strings", what do you mean? You mean their localized paths? — Richard Peck
– Richard Peck, Commented Jun 26, 2014 at 9:30

nathanvda · Accepted Answer · 2014-06-27 10:14:05Z

1

The simple solution is to add a helper. So in helpers/places_helper.rb write

module PlacesHelper

  def get_carrousel_images(place)
    [
      @place.image_1,
      @place.image_2,
      @place.image_3,
      @place.image_4,
      @place.image_5,
      @place.image_6
    ].select {|img| img.present? }
  end

and then you can write the following in your view:

<div style="position:relative">
  <div id="home-carousel" class="carousel">
    <div class="carousel-inner">
      <% get_carrousel_images(@place).each do |image| %>
        <div class="item">
          <%= image_tag image %>
        </div>
      <% end %>
    </div>
  </div>
</div>

Now having the 6 image_x fields for place looks a bit smelly, so I would prefer a nested model instead as Rich Peck proposes, although I understand having the 6 fields is easier to start with.

edited Jun 27, 2014 at 10:14

answered Jun 26, 2014 at 14:09

nathanvda

50k14 gold badges120 silver badges140 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Tom Pinchen Over a year ago

Thanks for your help Nathanvda this seems to work so long as there are always 6 images. When it's missing images it's returning 'src="/assets"' which is meaning no images at all are displayed. Any ideas how I can handle if an image object is blank?

nathanvda Over a year ago

I do the compact, which should delete the nils. If there is no image, is the image_x nil or an empty string?

Tom Pinchen Over a year ago

Ah my bad, they are coming through as nils and it is deleting them where they don't exist. Seems to be working now :)

Tom Pinchen Over a year ago

Oh no. It's broken again. It's passing back a src="assets".

nathanvda Over a year ago

You do have to give me a little more info. Code does not simply work and then not work. Can you find out what the difference is? When does it work, when doesn't it? But assuming the code you gave us always worked, I am assuming some do have empty string instead of nil, so I replaced the compact with a select which mimics your above code.

Richard Peck · Accepted Answer · 2014-06-26 09:42:40Z

0

Images

It will all depend on how you've set up the images in the db, and how you'd like to show them in the view

If you have the images in the User model, you could call them like this:

app/controllers/users_controller.rb
Class UsersController < ApplicationController
   def show
       @user = User.find params[:id]
       @images = @user.images
   end
end

This is obviously very generalised - I would recommend you post some context to your question, so we know what you're asking specifically

--

Paperclip

If you're using Paperclip or Carrierwave, you'll basically have the images attached to various objects in your database. For example, you'll have the following:

#app/models/image.rb
Class Image < ActiveRecord::Base
   has_attached_file :attachment
end

This allows you to call:

@images = Image.all
@images.each do |image|
   image.attachment.url #-> image URL
end

This is the standard way to handle images / attachments in Rails, as it ties directly into ActiveRecord. Returning an array of image paths would therefore be a case of calling Model.all or Model.where

answered Jun 26, 2014 at 9:42

Richard Peck

76.8k9 gold badges98 silver badges148 bronze badges

1 Comment

Tom Pinchen Over a year ago

Thanks for your reply Rich! I have added some further explanation above. Images in this instance are saved on the Place model using the carrierwave gem. Hopefully my extra info above will make things a little more clear :)

Collectives™ on Stack Overflow

How to put images into an array Ruby on Rails

2 Answers 2

5 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related