i have the following code:
<td><%= link_to(image_tag("delete.gif", :size => "16x16", :alt => "Delete Entry"), phone, :confirm => 'Are you sure?', :method => :delete, :remote=>true, :class=>'delete_phone') %></td>
in my view. Now, it all works fine and does what I need it to, but when I hover over the icon, well, it doesn't show me any text. I've tried in Firefox and Chrome.
Has anyone else come across the same issue?
Thanks!
#protip - it can be a painful (and very un-DRY) exercise to add titles for all your images. To make this a lot less painful all my apps ship with this JS (require jquery):
$(function() {
$('img').each( function() {
var o = $(this);
if( ! o.attr('title') && o.attr('alt') ) o.attr('title', o.attr('alt') );
});
});
This sets the title of any img without a title to the value of it's alt attribute.
Use title, not alt, and your problems will be solved! Alt is for accessibility - it means "alternate". Title is what you'd use for a tooltip.
On hover image title text is shown in tooltip.
Alt text is for users with disabled images (or slow connection) and search engines
I have no idea about Ruby, but you need to use the title attribute in HTML to get the rollover text appearing in most browsers.. Does that help at all?
eg
<img title="hello thar" src="hellothar.gif" />
Use title option to display text in rails 3.
<%= image_tag 'Profile.png',:title => 'Profile' %>
When mouse hover over the Profile.png, it will show the text Profile.
Related
I don't want to use the default
<%= f.submit %>
and have created a helper function for it, which also embeds an icon. The helper function expects a label to put on the newly created button.
I'm calling it like this:
<%= submit_button("icon-plus", I18n.translate("helpers.submit.create")) %>
But now on this text appears on the button:
%{model} toevoegen
Instead of:
Product type toevoegen
If I use the normal submit button then the correct text appears so my yml files are correct. How can I get the correct text to use in the helper?
Helper code:
def submit_button(icon, label)
link_to "javascript:void(0)", :class => 'btn btn-primary', :onclick => "$(this).closest('form').submit()" do
raw('<div class="') + icon + raw(' icon-white"> ') + label +raw('</div>')
end
end
As the I18n guide says, the translate function interpolates variables passed in the %{} brackets using its second argument (a hash).
In your case you need to tell it the model by doing this:
I18n.t("helpers.submit.create", model: "Product type")
If you want a generic option that would work for any model, you can see how Rails itself does it by looking at the source on GitHub - it's something like
I18n.t("helpers.submit.create", model: f.object.class.model_name.human)
As an aside, you don't need to (and probably shouldn't) use raw there. What you are trying to achieve could easily be done with the built-in helpers:
link_to ... do
content_tag :div, label, class: "#{icon} icon-white"
end
I have a failing rspec view test but the code works - I probably have a variable incorrectly setup but can't figure out what it is.
When I display the contents of #incident_report (pp #incident_report) in my spec, it properly displays the record created by FactoryGirl.
When I display the actual rendered content (puts rendered), it shows the values from the the record I created with FactoryGirl...
But the "rendered.should contain(work_order)" spec fails with:
1) incident_reports/show.html displays the work order number on the incident
Failure/Error: rendered.should contain(work_order)
expected the following element's content to include "54785":
and none of the data is displayed, only the HTML template
spec/views/incident_report/show.html.haml_spec.rb code
require 'spec_helper'
describe "incident_reports/show.html" do
before(:each) do
#incident_report = Factory(:incident_report)
end
it "displays the work order number on the incident" do
work_order = #incident_report.work_order
pp #incident_report #displays an incident_report, id => 1
assign(:incident_report, #incident_report)
render
puts rendered #this DOES have the content from #incident_report
rendered.should contain("Work Order:")
rendered.should contain(work_order)
end
end
show.html.haml code
%h1 Display Incident Report
.navigation
= link_to 'Edit', edit_incident_report_path(#incident_report)
|
\#{link_to 'Back', incident_reports_path}
= render 'form'
.navigation
= link_to 'Edit', edit_incident_report_path(#incident_report)
|
\#{link_to 'Back', incident_reports_path}
Gotta be something really simple I'm overlooking.
Turns out it's because I was using simple_form and when simple_form displays for a "show" action, it puts the field values into the html as a 'value="54785"' attribute. If you display it in a browser, the labels and values all show up correctly, but rspec can't see them.
I had to add
rendered.should have_tag 'input', :with => { :value => "54765", :name => 'incident_report[work_order]' }
to my example to get it to work.
Seems like there should be a better solution but at least now I can continue testing.
I have a form which contains one model (let's call it Model1) and this models accepts nested attributes from another one (let's call it Model2). I want to be able to save many Model2 records, but I want the view, at the beginning, to show just one set of fields from Model2, and have a button which, if clicked, displays another set of fields from that model, and so on. For this, i'm using the nested_form gem.
All is working well, but the problem is that one of the fields is associated with a datepicker. So, the first Model2 set of fields shows the calendar, but when I click to render the next set of fields, the datepicker, of course, does not get shown anymore (because the Javascript loads only when you get to the page and never again)
The following code shows the button which adds more concepts (Concept is Model2)
<%= f.fields_for :concepts do |concept_form| %>
<%= render "courses/concept_fields", :f=>concept_form%>
<% end %>
<p><%= f.link_to_add t("concepts.add"), :concepts %></p>
And inside courses/concept_fields I have:
<%= f.text_field :collection_date, :value => f.object.collection_date, :class => 'text date_picker tabs' %>
The javascript for the datepicker is included in the layout
Is there any way you can help me? Thanks!
Add and click event handler to the button you use to render the next set of fields to reload the datepicker something like:
$('.render_next_button').click(function(){
// code to reload datepicker
$( "#datepicker" ).datepicker();
});
I've found an answer which solved my problem. It's in this link:
jQuery UI DatePicker with nested_forms Gem
Would look like this:
<script type="text/javascript">
jQuery(function() {
jQuery('form').live('nested:fieldAdded', function(event) {
jQuery(event.field).find('.date_picker').removeClass('hasDatepicker').datepicker();
});
});
</script>
I have a "mini" form on the home page which allows the user to select a car color and press submit.
After doing so, the user is taken to another form where the previously selected car color is used to
pre-populate a field in this other form.
The mini form is this:
<%= form_tag('/cars/new', :method => :get) %>
<%= select "new_car", "color_id", Colors.find(:all, :order => "description asc").
collect {|s| [ s.description, s.id ] }, {:include_blank => 'Select color'} %>
<input type="submit" value="Submit"/>
On pressing submit, this routes to the correct action (/cars/new) but the URL in the address bar is:
http://localhost:3000/cars/new?utf8=✓&new_car[color_id]=12
Where I expected it to be:
http://localhost:3000/cars/new?color_id=12
How to make get the URL to look like the one above?
Another question, how exactly is the form_tag to be used? How do you put a closing </form> tag?
For the block form of form_tag, see:
http://api.rubyonrails.org/classes/ActionView/Helpers/FormTagHelper.html#method-i-form_tag
For the query string issue, there's a similar question here:
removing "utf8=✓" from rails 3 form submissions
I'm building translation for my application, but I cannot figure out how to translate the default captions for form fields.
Specifically the file_form tag. The default is to produce a button with the caption 'Choose file' and a note to the side stating 'No file chosen'
Where in the yml do these translations exist?
Unfortunately, <input type="file"> and how it appears to the user is up to the browser, and it's not possible to chance all too much of it.
You can find several articles about styling them to look a bit different, but the text on the button itself and the note depends on the language of the browser the user are running, and you cannot change it (at least nothing I can find)
you better use bootstrap file upload. The code below is for my application and its multilanguage
= transloadit :image_resize
-6.times do |index|
.fileupload.fileupload-new.pull-left{style: "padding-right: 5px;", "data-provides" => "fileupload" }
.fileupload-new.thumbnail{:style => "width: 130px; height: 130px;"}
-if #provider.provider_images.present?
- if #provider.provider_images["provider_image#{index+1}"].present?
%img{:id=>"providerimage1", :src => #provider.provider_images["provider_image#{index+1}"][0]}/
.fileupload-preview.fileupload-exists.thumbnail{:style => "width: 130px; height: 130px;"}
%div
%span.btn.btn-file
%span.fileupload-new{:id => "selectbutton"}
-if index == 0
=t('select_profile_image')
-else
=t('select_image')
%span.fileupload-exists
-if index == 0
=t('select_profile_image')
-else
=t('select_image')
=file_field_tag "provider_image#{index+1}"