0

I'm new to rails and stack over flow, I would be grateful to you all if I can guided here.

I'm developing a test site which is like a personal blog just to add portfolio for one user.

I have a scaffold "Images" which is used to add images in the application the scaffold have only two fields one to upload the image and other for the photographer name.

  1. The images will be shown on the home page - which is working absolutely fine.
  2. However, when I click the image the image gets zoomed in and the user can use the right and left arrows to scroll the pictures.
  3. My problem - When the image is click the images are not getting fetched and it shows the message "This image could not be loaded.

Below is my code for your kind reference, I'm sure I'm making some mistake in this line

<a href="image_tag image.photo.url" title="<%= image.by %>" >

However, unable to rectify it yet.

any help or suggestion would be great.

My Code

<!-- start portfolio section -->
<section class="wow fadeIn">
  <div class="container">
    <div class="row">
      <div class="col-md-12 no-padding xs-padding-15px-lr">
        <div class="filter-content overflow-hidden">
          <ul class="portfolio-grid work-3col hover-option4 lightbox-gallery gutter-small">
            <li class="grid-sizer"></li>
            <!-- start portfolio item -->
            <% @images.order('created_at DESC').each do |image| %>
            <li class="grid-item web branding design wow fadeInUp">
              <a href="image_tag image.photo.url" title="<%= image.by %>" >
                <figure>
                  <div class="portfolio-img bg-extra-dark-gray">
                    <%= image_tag image.photo.url, class: "project-img-gallery", alt: "" %>
                  </div>
                  <figcaption>
                    <div class="portfolio-hover-main text-center">
                      <div class="portfolio-hover-box vertical-align-middle">
                        <div class="portfolio-hover-content position-relative">
                          <i class="ti-zoom-in text-white fa-2x"></i>
                        </div>
                      </div>
                    </div>
                  </figcaption>
                </figure>
              </a>
            </li>
            <% end %>
            <!-- end portfolio item -->
          </ul>
        </div>
      </div>
    </div>
  </div>
</section>
<!-- end portfolio section -->
  • can you open the browser console and see wich error you get? – inye Jan 02 '19 at 13:33
  • Rendering home/index.html.erb within layouts/application Image Load (7.7ms) SELECT "images".* FROM "images" ORDER BY created_at DESC ↳ app/views/home/index.html.erb:28 Rendered home/index.html.erb within layouts/application (40.8ms) Rendered shared/_message.html.erb (2.2ms) Completed 200 OK in 633ms (Views: 582.3ms | ActiveRecord: 7.7ms) Started GET "/image_tag%20image.photo.url" for 127.0.0.1 at 2019-01-02 19:06:49 +0530 ActionController::RoutingError (No route matches [GET] "/image_tag%20image.photo.url"): – Peeyush Verma Jan 02 '19 at 13:37

1 Answers1

1

This line

<a href="image_tag image.photo.url" title="<%= image.by %>" >

should probably only be look like this:

<a href="<%= image.photo.url %>" title="<%= image.by %>" >
spickermann
  • 100,941
  • 9
  • 101
  • 131
  • nice catch.. :) – ray Jan 02 '19 at 13:48
  • @spikermann can you also take a look in one of my other question regarding images. https://stackoverflow.com/questions/54019061/rails-unable-to-add-image-within-style-background-imageurl-from-databa – Peeyush Verma Jan 03 '19 at 09:03
  • @PeeyushVerma You might want to consider upvoting helpful answers and accepting an answer once your issue is solved. – spickermann Jan 03 '19 at 09:20