Anybody knows how to setup the gem bootstrap-datepicker-rails? I followed the steps in http://rubydoc.info/gems/bootstrap-datepicker-rails/0.6.21/frames, basically:
I setup twitter-bootstrap-rails gem
I add this to gemfile gem 'bootstrap-datepicker-rails', '>= 0.6.21'
Add this line to app/assets/stylesheets/application.css
*= require bootstrap-datepicker
Add this line to app/assets/javascripts/application.js
//= require bootstrap-datepicker
Add this line to app/assets/javascripts/controllername.js.coffee
$('.datepicker').datepicker()
Finally use in view :)
<input type="text" data-behaviour='datepicker' >
But it doesn't work!! Anybody has got it to work? It should work nice as shown here:
http://jsfiddle.net/2Gg5k/43/
Look at step 5 and step 6, your selection class .datepicker in javascript but not in input field
Try this
on views (e.g form)
<%= f.text_field :mydate, 'data-behaviour' => 'datepicker' %>
<script type="text/javascript">
$('[data-behaviour~=datepicker]').datepicker();
</script>
Or As component :
<div class="input-append date datepicker" data-date="12-02-2012" data-date-format="dd-mm-yyyy">
<%= f.text_field :mydate, 'data-behaviour' => 'datepicker', :disabled => 'disable' %><span class="add-on"><i class="icon-th"></i></span>
</div>
<script type="text/javascript">
$('.datepicker').datepicker();
</script>
Example above all if the attribute using date type.
You can use bootstrap-datetimepicker-rails gem, if the attribute using datetime type
In the view, try this:
<div class="field">
<%= f.label 'Trade Date: ' %>
<%= f.text_field :trade_date, 'data-behaviour' => 'datepicker' %><br />
</div>
In your application.js, use:
$(document).on("focus", "[data-behaviour~='datepicker']", function(e){
$(this).datepicker({"format": "yyyy-mm-dd", "weekStart": 1, "autoclose": true})
});
instead of
$('.datepicker').datepicker()
I did the same, but I change the code:
$('.datapicker').datapicker()
By this code:
$('[data-behaviour~=datepicker]').datepicker()
I try using a class 'datapicker' but not found.
This is my example, I use to HAML and coffeescript
events.js.coffe
$ ->
$('[data-behaviour~=datepicker]').datepicker()
_form.haml
= simple_form_for #event, :html => {:class => "form-horizontal well"} do |f|
.field (That is the same )
= f.input :date, :input_html => { "data-behaviour" => "datepicker" }
.form-actions
= f.button :submit, 'Create Event' ,:class => 'btn btn-success btn-large'
Related
I have to convert my form to not using nested association. In other words, instead of
<%= link_to_add_association f, :contacts, class: 'btn btn-primary', partial: 'projects/contact_fields', data: {
association_insertion_node: '.contact_fields', association_insertion_method: :append
} do %>
<i class="fas fa-plus"></i>
<% end %>
<%= f.fields_for :contacts do |contact| %>
<%= render 'projects/contact_fields', f: contact %>
<% end %>
I would like to be able to just pass in a string to be used as the container (similar to how you can with field_for).
<%= link_to_add_association 'contacts[]', 'projects/contact_fields', class: 'btn btn-primary', partial: 'projects/contact_fields', data: {
association_insertion_node: '.contact_fields', association_insertion_method: :append
} do %>
<i class="fas fa-plus"></i>
<% end %>
<% #contacts.each_with_index do |contact, index| %>
<%= fields_for "contacts[#{index}]", contact do |c| %>
<%= render 'projects/contact_fields', f: c %>
<% end %>
<% end %>
Cocoon is currently unable to edit/manage a collection. Cocoon is just helping the form-behaviour for nested-children functionality in rails, so there is no simple solution to edit an array or collection. On the other hand, this is in general pretty simple to implement without cocoon.
Very high level, do something like:
#contacts.each do |contact|
= render `contacts/edit`, contact: contact
= render `contacts/new`
so render the edit form for each existing contact, and render an empty new form. You will have to edit your controller functionality a little, because you will always re-render the complete collection/index page (with all existing contacts in the collection?).
So you can just render multiple forms on one page. Using turbolinks this will render fast and feel actually completely the same. You could use xhr to update only specific parts of the page, but to get started that is not even needed.
So I ended up following drifting ruby and using code from the cocoon gem to implement something myself. I hope others can benefit from it. Thank you nathanvda for the cocoon gem which helped me with the code below, really wish I could have used it:
add this to your app/helpers/application_helper.rb
def link_to_add_row(*args, &block)
if block_given?
link_to_add_row(capture(&block), *args)
else
#byebug
name, association, new_object, partial, html_options = *args
html_options ||= {}
html_options[:class] = [html_options[:class], "custom_add_fields"].compact.join(' ')
id = 'NEW_RECORD'
fields = fields_for("#{association}[#{id}]", new_object, child_index: id) do |builder|
#byebug
render( partial, f: builder)
end
fields = CGI.escapeHTML(fields).html_safe
link_to(name, '#', class: html_options[:class], data: {id: id, fields: fields})
end
end
add to your app/assets/application.js
$(document).on('click', '.custom_remove_fields', function(event) {
$(this).prev('input[type=hidden]').val('1');
$(this).closest('tr').hide();
return event.preventDefault();
});
$(document).on('click', '.custom_add_fields', function(event) {
var regexp, time;
time = new Date().getTime();
regexp = new RegExp($(this).data('id'), 'g');
$('.contact_fields').append($(this).data('fields').replace(regexp, time));
return event.preventDefault();
});
In your template you can use the following to render a partial for the collection:
<%= link_to_add_row('contacts', contact.new, 'contact_fields', class: 'btn btn-primary') do %>
<i class="fas fa-plus"></i>
<% end %>
This is how I render the partial with the collections in my template:
<tbody class="contact_fields">
<% #contacts.each_with_index do |contact, index| %>
<%= fields_for "contacts[#{index}]", contact do |c| %>
<%= render 'contact_fields', f: c %>
<% end %>
<% end %>
</tbody>
This is what my contact_fields.html.erb partial looks like.
<tr class="nested-fields">
<td>
<%= f.text_field :fullname, class: 'form-control invoke-contacts-search contact-fullname' %>
</td>
<td>
<%= f.text_field :email, class: 'form-control invoke-contacts-search contact-email' %>
</td>
<td>
<%= f.text_field :phone, class: 'form-control contact-phone' %>
</td>
<td>
<%= f.text_field :department, class: 'form-control contact-department' %>
</td>
<td>
<%= f.text_field :manager, class: 'form-control contact-manager' %>
</td>
<td>
<%= f.hidden_field :id %>
<%= f.hidden_field :_destroy %>
<%= link_to '#', class: 'btn btn-danger custom_remove_fields' do %>
<i class="fas fa-trash-alt"></i>
<% end %>
</td>
</tr>
i have a long list dropdown menu including all currencies, i want the last selected value to be the default selected value in the list.
i am using Rails 4.0.0 and ruby 2.0.0
i am not using a model, i am just using a controller. i have put the dropdown list options inside a helper.
form.html.erb
<div class="calculator">
<%= form_for :convertor, :url => {:controller => "converter", :action => "show" } do |f| %>
<%= f.label :from_currency %>
<%= f.select :from_currency, options_for_select(currencies, :selected => params[:from_currency]) %>
<%= f.text_field :amount, :placeholder => "Amount", id: "textfield" %>
<%= #amount %>
<br>
<%= f.label :to_currency %>
<%= f.select :to_currency, options_for_select(currencies, :selected => params[:to_currency].to_i ) %>
<%= #result %>
<br>
<%= f.submit "Calculate", class: "btn btn-large btn-primary", id: "submitButton" %>
<% end %>
</div>
the list options are loaded from a helper *<%= f.select :to_currency, options_for_select(currencies, :selected => params[:to_currency].to_i ) %>* with name currencies
the dropdown list, in a helper
def currencies
[
['United Arab Emirates Dirham (AED)', 'AED'],
['Netherlands Antillean Guilder (ANG)', 'ANG'],
['Argentine Peso (ARS)', 'ARS'],
['Australian Dollar (A$)', 'AUD'],
['Bangladeshi Taka (BDT)', 'BDT'],
['Bulgarian Lev (BGN)', 'BGN'],
['Bahraini Dinar (BHD)', 'BHD'],
]
end
what am i doing wrong here?
A couple of things:
options_for_select takes two arguments: the list of options and the value that you want selected.
You're passing through the value as a hash: :selected => params...
The parameter name is wrong.
In your controller, you're saying that the parameter is called this:
params[:convertor][:from_currency]
But in your view, you have params[:from_currency].
Therefore, the solution to this is to do this:
<%= f.select :from_currency, options_for_select(currencies, params[:convertor][:from_currency]) %>
This code works for me.
in application helper
module ApplicationHelper
def opts_for_select_cur
opts_for_select = [
['United Arab Emirates Dirham (AED)', 'AED'],
['Netherlands Antillean Guilder (ANG)', 'ANG'],
['Argentine Peso (ARS)', 'ARS'],
['Australian Dollar (A$)', 'AUD'],
['Bangladeshi Taka (BDT)', 'BDT'],
['Bulgarian Lev (BGN)', 'BGN'],
['Bahraini Dinar (BHD)', 'BHD'],
]
return opts_for_select
end
end
and in view
<script type="text/javascript">
$(document).ready(function(){
$('#st').change(function(){
var inputText = $('#st :selected').val();
$("#hidden_one").val(inputText);
$("a").attr("href", "?value="+inputText );
});
$('#aa').click(function(){
var inputText = $('#st :selected').val();
$("a").attr("href", "?value="+inputText );
});
});
<%= f.select :text, options_for_select(opts_for_select_cur, params[:value]), {}, { id: "st" } %>
<br>
<%= link_to "refresh",nil, id: "aa" %>
the result is a select box with selected value.
this can help
<%= f.label :from_currency %>
<% if #from_cur.present? %>
<%= f.select :from_currency, options_for_select(currencies, #from_cur) %>
<% else %>
<%= f.select :from_currency, options_for_select(currencies), :required => true %>
<% end %>
<%= f.text_field :amount, :placeholder => "Amount", :required => true, id: "textfield" %>
<br>
<%= f.label :to_currency %>
<% if #from_cur.present? %>
<%= f.select :to_currency, options_for_select(currencies, #to_cur), :required => true %>
<% else %>
<%= f.select :to_currency, options_for_select(currencies), :required => true %>
<% end %>
i appreciate.
What am I missing here? I am working with Rails 4.0.0 and trying out the new Bootstrap 3.0.0rc1. I have a simple 'recipe box' app that has a Recipe model and a Category model that feeds a 'category' field on the Recipe. In the recipes#new view, I have the following fields defined:
<h1>Create New Recipe</h1>
<%= form_for #recipe, html: { class: 'form-horizontal' } do |f| %>
<fieldset>
<legend>Main Information</legend>
<div class="form-group">
<%= f.label :name, "Recipe name", class: "col-lg-2 control-label" %>
<div class="col-lg-6">
<%= f.text_field :name, class: "form-control" %>
</div>
</div>
<div class="form-group">
<%= f.label :category_id, class: "col-lg-2 control-label" %>
<div class="col-lg-6">
<%= f.collection_select :category, Category.all, :id, :name, class: "form-control", prompt: "Select a category" %>
</div>
</div>
...
The text_field helper renders a properly formatted tag, complete with class attribute. However, no matter how I construct the select or collection_select helpers, I can't seem to get Rails to give me a that contains a class attribute. The code above gives me this:
<select id="recipe_category" name="recipe[category]"><option value="">Select a category</option>
...
So the prompt comes through, but the class attrib does not, so it looks like part of html_options hash is recognized. But the Bootstrap styling isn't applied. Doesn't matter if I use braces {} around the class: "form-control" or not. Doesn't matter if I use parens around the collection_select params or not. Happens with select helper as well.
Can anyone advise? Are you seeing this too?
Try using :
<%= f.collection_select :category, Category.all, :id, :name, {prompt: "Select a category"}, {class: "form-control"} %>
According to the rails documentation, first comes options and then html options. Remember that html options need to be in braces: {prompt: "Select a category"} or {class: "form-control"}.
<%= f.collection_select :category, Category.all, :id, :name, {prompt: "Select a category"}, {class: "form-control"} %>
The checked answer doesn't work, but is checked because the correct answer buried in the comments (provided by Alter Lagos). I am trying to avoid confusion by moving the actual answer out of the comments.
Try this, works for me!
<%= collection_select(:category, :category_id, #category_for_advertising, :id, :description, {}, {:class=>"dropdown-menu"}) %>
Another version of what has been answered, incorporating W3CSS:
<%= family_form.collection_select :billing_status_id,
> BillingStatus.by_tenant(#cutid).order(:description), :id,
> :description, {}, {class: 'w3-select'} %>
<%= family_form.label
> :billing_status, class: 'w3-label' %>
Probably an easy question but it's been nagging at me for ages and I can't find an answer anywhere. I'm using the gmaps4rails gem and I want to add a callback function after the map has loaded. When I use the basic helper everything works fine, like this:
<%= gmaps4rails(#json) %>
<% content_for :scripts do %>
<script type="text/javascript">
Gmaps.map.callback = function() {
alert('callback');
}
</script>
<% end %>
<%= yield :scripts %>
But if I replace <%= gmaps4rails(#json) %> with the gmaps helper, the callback doesn't happen:
<%= gmaps("markers" => { "data" => #json }) %>
<% content_for :scripts do %>
<script type="text/javascript">
Gmaps.map.callback = function() {
alert('callback');
}
</script>
<% end %>
<%= yield :scripts %>
Can anyone suggest why this might happen?
Of course the answer always comes the moment you pull your hair out and ask here. The problem is the version of the gem I was using. I still don't know why it wasn't working with 1.4.6, but 1.5.5 seems to work fine.
I have this form:
<% #page_title = "Delete Technician: #{#technician.name}" %>
<%= link_to("<< Back to List", {:action => 'list', :id => #technician.id}, :class => 'back-link') %>
<div class="technician delete">
<h2>Delete Technician</h2>
<%= form_for(:technician, :url => {:action => 'destroy', :id => #technician.id}) do |f| %>
<p>Are you sure you want to permanently delete this technician?</p>
<p class="reference-name"><%= #technician.name %></p>
<div class="form-buttons">
<%= submit_tag("Delete Technician") %>
</div>
<% end %>
</div>
when I click on the submit button this is the url that I get:
www.site.com/technicians/1
instead of
www.site.com/technicians/destroy/1
am I not using the form_for helper correctly or is it a configuration somewhere?
You're making this more complicated than it needs to be. There is no reason for a form when a link or a button would do. Why not just this
<p>Are you sure you want to permanently delete this technician</p>
<div> <%= link_to "Delete", technician_path(#technician), :method => :delete %> </div>
That's it.