This code doesn't throw any errors, but no photos appear. The <div> around the code is empty when I check in inspect element. If I change #user.photos.last(5) to #user.photos.each, the photos appears. But I want to show only 5 of the most recently added photos.
<%- #user.photos.last(5) do |photo| %>
<div class="col-xs-6 col-md-3 no-padding">
<a href="<%= user_photo_path(#user.username, photo.id) %>" class="photo-thumbnail">
<%= image_tag photo.url %>
</a>
</div>
<% end %>
What am I doing wrong?
Please take some time to go though documentation once again. it is just a minor problem.
<%- #user.photos.last(5).each do ....
Related
I am newbie with Rails and trying to display photos to my homepage and here is my code at my home.html.erb
<br/>
<div class="row">
<% #courses.each do |course| %>
<div class="col m4">
<div class="card">
<div class="card-image">
<%= link_to course do %>
<%= image_tag "courses/#{course.image}" %>
<% end %>
</div>
<div class="card-content">
<span class="card-title"><%= course.title %></span>
<% (1..course.star).each do %>
<1 class="material-icons" green-text>grade</i>
<% end %>
</div>
</div>
</div>
<% end %>
</div>
I made another page named "course" to upload photo to the homepage.
Then, when I ran the code, it said to me that at the line <%= image_tag "courses/#{course.image}" %> there was an error. The asset "courses/image1" is not present in the asset pipeline.
Here is what I did.
First, I went to app/assets/images.
Second, I made folder which named "photos".
Third put image to the folder "photos".
And Last I tried the code but there was the error.
Could you please give me some ideas? Thank you very much.
Rails is pretty smart, so when you provide it a path in an image_tag, such as courses/images1, it prepends this path with app/assets/images (by default) such that the full relative path is app/assets/images/courses/images1.
So to update your image_tag you should firstly pass it your image file type: .jpg or .png etc. Second update your path to photos/images.file_type where filetype is your image filetype. If you want to put a /courses directory in your /photos file, and place image1.file_type in there, then your path would be photos/courses/images.file_type.
i have this call for the image from Active Storage, using url_for
<% #posts.each do |post| %>
<div class="card-group card-group-size">
<div class="card recipes recipes_posts">
<img src="<%= url_for(post.image) if post.image.attached? %> " class="index_images">
<div class="card-body">
<h5 class="card-title"><%=link_to post.title, post, class: "post_title"%></h5>
</div>
</div>
</div>
<% end %>
This was the only way to call it there (/post/index.html.erb).
I could call the same image with <%= image_tag #post.image, class: "image_view" %> in posts/show.html.erb, but this wont work on any other page.
i dont have any issues with the loading of the image, that work as is should, i only wish to know if i can make onclick that image to link to the post that belongs.
thank you
Wrap your image in link tag passing link to show action. I assume there is a routes configure and available as helper post_path
<%= link_to post_path(post) do %>
<%= image_tag post.image, class="index_images" if post.image.attached? %>
<% end %>
I have a multiple upload images, using carrier wave, on my application and with the help of you guys, in another question, I was able to display all the images with a each method. It works very well but I would like to improve it. I want to do a image gallery with a carousel and when the user click at it opens a modal with the image bigger.
I try to do following the tutorial of W3C School but just doesn't work.
When I try to put the Onclick method the page doesn't render.
https://www.w3schools.com/howto/howto_js_lightbox.asp
There is any gem that help me do this? There is any tutorial for a rails application?
I am displaying the images with the following code:
<% #imovel.imagens.each do |imagem| %>
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<%= image_tag(imagem.url) if #imovel.imagens? %>
</div>
</div>
<% end %>
You will use link_to to create the a tag with a block. The arguments are:
link_to(url, html_options = {})
Inside the block, you will put the html code inside the a tag (your image).
<% #imovel.imagens.each do |imagem| %>
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<%= link_to imagem.url, class: 'your-css-class', 'data-toggle': 'lightbox', 'data-gallery': 'name-of-gallery' do %>
<%= image_tag(imagem.url) %>
<% end if #imovel.imagens? %>
</div>
</div>
<% end %>
In laravel I am use to being able to access the key in a loop. In rails I cannot find answer to how to get that from the loop.
Standard loop like so
<% #subjects.each do |subject| %>
<div class="col-md-6 subjectColumn">
<div class="subjectBox subjectBox-<%= key %>">
<h2><%= subject.title.capitalize %><h2>
<p><%= subject.description %></p>
View courses<i class="fa fa-angle-right"></i></h2>
</div>
</div>
<% end %>
I want to add the integer for the key in the code above. I have tried...
<% #subjects.keys.each do |key, subject|
...and other various things I found here and elsewhere but nothing worked. The above code created an error. Most of the things I found just did not give any number. Any help with this would be greatly appreciated. I feel I probably just have not got the syntax quite correct or something.
Use with_index:
<% #subjects.each.with_index(1) do |subject, index| %>
<div class="col-md-6 subjectColumn">
<div class="subjectBox subjectBox-<%= index %>">
<h2><%= subject.title.capitalize %><h2>
<p><%= subject.description %></p>
View courses<i class="fa fa-angle-right"></i></h2>
</div>
</div>
<% end %>
I am trying to get rails to generate dynamic navigation tabs that refer to groups user is enrolled at. Basically, what I want to achieve is to dynamically have tabs named after groups that user is enrolled at (which is working fine) and then showing the content of each group by clicking on its tab (which is not working properly for some reason). The page loads data correctly but toggling between tabs doesn't work
Here is the code in the view
<div class="tabbable tabs-left">
<div class="row">
<div class="col-md-4">
<ul class="nav nav-pills nav-stacked">
<% current_user.group.each do |group| %>
<li><a href="#<%= group.name %>" data-toggle="tab">
<%=group.name %></a></li>
<% end %>
</ul>
</div>
<div class="col-md-8">
<div class="tab-content">
<% current_user.group.each do |group| %>
<div class="tab-pane fade <%= 'in active' if current_user.group.first == group %>" id="<%=group.name%>">
<% if current_user.group_feed(group.id).any? %>
<ol class="microposts">
<%= render current_user.group_feed(group.id) %>
<%= group.name %>
</ol>
<% end %>
</div>
<% end %>
</div>
</div>
</div>
</div>
Is there something that I am missing?
The problem is group.name producing an invalid html id attribute.
html ids should not start with a number(numbers anywhere else are ok), and have no spaces. Example:
Invalid:
1foo
aaa b
Valid:
foo1
aaa-b
group.name.parameterize will remove any odd chars(#£$ etc) and replace spaces with "-" so use that.
You also want to make this unique as things with names like: "foo" and "foo!" will parameterize to the same thing: "foo".
I'd go with:
id="<%=(group.name.gsub(/[0-9]+/, "")+group.id.to_s).parameterize%>"
This code, removes any number from the name(it only really applies at the start of the id) then adds the id on the end making it unique.