I want to add the user's avatar next to the name in options:
<%= f.select(:user_id,
#users.map{|s|[s.lastname+', '+s.firstname, s.id]},
{},
:class => "ui fluid dropdown"
) %>
And If possible, I want also to enter some html in it:
<%= #user.avatar.blank? ?
image_tag("no-image.png", alt: "noimage", class: "ui small rounded image") :
image_tag(#user.avatar.url(:thumb), alt: "user-image", class: "ui small rounded image")
%>
How is it possible in Rails 4?
EDIT: Another thing I want to do is to display a circle with a color on the front of the text. Let's say I want a green dot in front of active users and a red on inactive ones. This is going to be implemented with CSS and I've seen it a lot of times in various websites, but I am not sure how to do it.
Related
Issue: I have a single text_field form with a submit button within a tables column. When I align the button to the right of the text_field, it pushes the entire form to the left and pushes all of the other columns as well.
I do believe the width: 85px (below) is effecting this but there needs to be a fix for this SOMEHOW
<td class="center">
<div class="input-group">
<%= form_for user, remote: true do |f| %>
<%= f.text_field :field, class: "form-control center", style: "width:85px;" %>
<%= f.button data: {confirm: "Are you sure?"}, class: "btn btn-light" do %>
<i class="fa fa-pencil" aria-hidden="true"></i>
<% end %>
<% end %>
</div>
</td>
https://jsfiddle.net/h9qrspdn/1/
The input-field doesn't work in the jsfiddle for whatever reason. But it puts the button in the same row and to the right of the text field. But you see my issue
This is all bootstrap 4 btw
There are 4 columns and the form is in the last column on the right side.
If I don't have the <div class="input-group">, everything is centered (aside from the font awesome button but that's a different issue - and i tried it with a regular f.submit and the same issue persists) within the forms column how it should be but the button is under the text_field. Once I had the <div class="input-group"> the button aligns to the right of the text_field, but then all of the columns shift about 10% to the left, and also the text_field/button are aligned to the left within its' column.
If there is a way to keep somehow position the button to the right without needing to use input-group? I feel like that may help it stay in the centered position and just have the button tack onto the right side.
How can I shift both the text_field/button to the center, and not effect the table to push the other elements?
I have the following in my html.erb file:
<%= image_tag "logo.jpg", :class => "img-responsive", :href =>"http://www.google.com" %>
However, this is not a clickable link. I assumed the :href = > would make it so. Does anyone have any ideas of making your rails image a clickable link? I tried the following logic which I found on another Stack Overflow Post:
<%= link_to image_tag("logo.jpg", :class => "img-responsive"), "http://wwww.google.com" %>
But this makes the image smaller and adds an odd half circle at the bottom of the image. I also cannot add :style or :class working properly.
Anyone have any ideas?
Not sure if this is the best way, but you could just wrap the image tag with regular anchor tags:
<a href="http://www.google.com">
<%= image_tag "logo.jpg", :class => "img-responsive" %>
</a>
The second way is technically the right way to do it, however since its giving you issues could always try this:
<%= link_to 'http://google.com' do %>
<%= image_tag 'logo.jpg', class: 'img-responsive' %>
<% end %>
As for the class/style not adding properly I've always done it as
class: 'this-is-a-class'
and
style: 'padding-left:30px;'
Ok so I've encountered a very very weird problem that has got me staying up late but I finally figured out whats wrong however, the solution is not ideal and I would like to know what is happening. Better yet, how to fix it.
I have a page seperated with many div tags with the id class. I have other pages that are done the same way with no problems at all when I try to link to a particular section of a page from another page with the following methods. However, the problem occurs when the page Im linking to has not enough content.. but still is at least scrollable length.. When clicking on the links that way, instead of moving to the desired section, it just moves towards the bottom.
For instance if you clicked on this website, http://aquaticshelp.com/aquascape/getting-started#aquascape-main-plants and clicked on the "Preparing your plant section" you will see what I mean. This is a very undesirable behavior and Im not sure where to go from here.
<%= link_to 'Section 1', route_path(anchor: "section-1"), class: "h4" %>
<div id="section-1">
</div>
<div id="section-2">
</div>
<div id="section-3">
</div>
EDIT: Added some screen shots for clarity of question
Below is where you click and contains the following code
<%= link_to aquascape_plants_prep_path(anchor: "aquascape-plants-prep-intro") do %>
<%= image_tag("aquascaping/start/plant_prep_img.jpg", size:"140x140", class: "img-circle center-block")%>
<%= link_to 'Preparing the Plants', aquascape_plants_prep_path(anchor: "aquascape-plants-prep-intro"), class: "h4" %>
<% end %>
The following is where it directs me to regardless of the anchor tag
Where I want it to go, and it does if I click on the following
<%= link_to 'Intro', "#aquascape-plants-prep-intro" %>
I'm new to RoR so bear with me.
I have this forthcoming website open in Production Mode here:
http://88.112.168.70/
I have there 2 FB logo pics at the end of every sub-page (the GREEN area) and I honestly have no idea on how to insert URL LINKS on those logos.
The FB logos and the whole ending section currently comes from a LAYOUT file, of whichs' code is below:
<tr>
<td class="otsikko-ala">
<p class="small">
<%=image_tag("facebook_logo-green.png", alt: "Tommi Tiihonen", :class=> "fb", :align=> "right")%>
<%=image_tag("facebook_logo.png", alt: "Tommi Tiihonen", :class=> "fb", :align=> "right")%>
<strong>Web-Studio</strong>
<br>
The World at Your Fingertips
</p>
</td>
So if I would like to have an URL on both images to, say, URL: http://www.com, then how would I do that? I ALSO don't want any borders on the URLed FB logos. BUT I do want to have a Title Tag and an Alt Tag on those.
AND:::: I want to have the TARGET frame value as "_new".
Please if it isn't too much asked, could you put the whole tag here - not only the explanation.
Thanks in advance!
-Tommi
If you want to make a link out of an image, just do this:
<%= link_to 'http://www.com', target: "_blank", alt: "my alt here", title: "my title here" do
<%= image_tag 'facebook_logo.png' %>
<% end %>
I have these two codes lines in subnativation.
<%= link_to "Basic Info", request.request_uri + "#users_details"%>
<%= link_to "Photos", request.request_uri + "#users_photos"%>
==>
/users/1#users_details
/users/1#users_photos
Its not navigating to that particular Div.
PS: users_details and users_photo are Id's of two different div's
#users_details will navigate to <a name='users_details'></a> and #users_photos to <a href='users_photos'></a> somewhere in your HTML.
So put before your users_details div this: <a name='users_details'></a> and enjoy!
Try writing your links in a style that makes it more obvious where you are actually trying to go: something like <%= link_to "Basic Info", users_path(#user, :anchor => 'user_details') %>. This will create a link to the users#show page but also include the anchor to go to any block level element with the id of user_details.