Rails+Facebox: pop-up-window doesn't work - json

I followed the source code form the rails3-devise-bootstrap-example to get my devise-login-page (that normally - without AJAX - works fine) in a popup window.
When I click on the login link nothing happens. The logfile tells me
Started GET "/facebox/fb_login" for 127.0.0.1 at 2014-01-09 19:15:0
Processing by FaceboxController#fb_login as JS
Rendered devise/shared/_links.erb (3.0ms)
Rendered devise/sessions/_new.html.erb (1155.0ms)
Rendered facebox/fb_login.js.erb (1251.0ms)
Completed 200 OK in 1509ms (Views: 1508.0ms | ActiveRecord: 0.0ms)
But no login-pop-up-window appears.
Here is the login link in my index.html.erb file
<%= link_to 'Login', fb_login_path, :remote => true %>
That starts my fb_login.js file
$.facebox('<%= escape_javascript(render :partial => 'devise/sessions/new') %>')
and should open _new.html.erb that looks like this:
<%= simple_form_for(resource, :as => resource_name, :url => session_path(resource_name)) do |f| %>
<div class="form-inputs">
<%= f.input :email, :required => false, :autofocus => true %>
<%= f.input :password, :required => false %>
<%= f.input :remember_me, :as => :boolean if devise_mapping.rememberable? %>
</div>
<div class="form-actions">
<%= f.button :submit, "Sign in" %>
</div>
<% end %>
<%= render "devise/shared/links" %>
but it doesn't. What went wrong?

I got the answer by myself . Under assets/javascripts I had to define
jQuery ->
$('a[rel*=facebox]').facebox()
# facebox - make modal
$(document).bind "loading.facebox", ->
$(document).unbind "keydown.facebox"
$("#facebox_overlay").unbind "click"
in a js.coffee file.

Related

How do I get select_tag to display text in front of the parameter?

I want to display "Year: " inside the 'year' dropbox shown in the image below. How do I append text to the parameter field?
I'm using a select_tag as shown below:
<%= form_tag results_path, :method => 'get' do %>
<%= select_tag :season_year, options_for_select(#tournaments.order(season_year: :desc).collect{ |u| [u.season_year] }.uniq, session[:season_year]), class: "btn btn-outline-primary", :onchange => "this.form.submit();" %>
<%= select_tag :tournament, options_for_select(#tournaments_filtered.order(tournament_date: :desc).collect{ |u| [u.lake_name, u.id] }, session[:tournament]), class: "btn btn-outline-primary", :onchange => "this.form.submit();" %>
<%= select_tag :table_select, options_for_select(#result_options, session[:table_select]), class: "btn btn-outline-primary", :onchange => "this.form.submit();" %>
<% end %>
You can use the include_blank option to add a dud option.
ie add include_blank: "Year:"
See docs for more details

Rails handling a list of collection_select

Pretty new to Ruby, but I'm working on a website for editing information on bus routes for a larger system. The DB has Route separate from it's list of stops, Trips. I'm trying to make the list of stops for each Route easily editable with a list of collection_select forms, where each presents a list of all of the stops to choose from. That was easy with the code below in
routes/_form.html.erb
<!-- handles the list of stops -->
<div class="stops_list" id="stops_list">
<%= f.label "Stops", :class => 'control-label'%>
<% params.merge!(:trips => {}) %>
<% puts params.inspect %>
<% trips = Trip.where('route_id = ?', #route.id).order('trips.order ASC') %>
<% #trips.each do |trip| %>
<%divId = 'stop'+trip[0].to_s %>
<div class="controls" id= <%= divId %>>
<%= f.label trip[0].to_s + '.', :class => 'control-label'%>
<%= collection_select params[:trips], trip[0].to_s, Stop.order('name ASC').all, :id, :name, {:selected => #trips[trip[0]]} %>
</div>
<% end %>
And then I update the proper tables in the DB from the routes_controller based on the data in params. I'd also like to be able to add and remove stops. I tried adding a 'remove stop' button, as below,
<%= button_to_function 'Remove stop',
'if(confirm("Really?")) {
$("#stops_list div").last().remove();
$.get("/routes/removeLastStop/'+(#route.id.to_s)+'");
}'%>
and it removes the proper collection_select form, but I then have to remove the stop from params. I tried doing an ajax call, as you can see, but then I have a new instance of the routes_controller, and the params I want to change is inaccessible. I'm not sure if I just set up the stops list wrong in the first place, or if there's a quick fix, but can anyone more experienced point me in the right direction?
EDIT:
Here's the entire form; it's pretty simple until you reach the area I've added
<%= form_for #route, :html => { :class => 'form-horizontal' } do |f| %>
<div class="control-group">
<%= f.label :name, :class => 'control-label' %>
<div class="controls">
<%= f.text_field :name, :class => 'text_field' %>
</div>
</div>
<div class="control-group">
<%= f.label :longname, :class => 'control-label' %>
<div class="controls">
<%= f.text_field :longname, :class => 'text_field' %>
</div>
</div>
<div class="control-group">
<%= f.label :color, :class => 'control-label' %>
<div class="controls">
<%= f.text_field :color, :class => 'text_field' %>
</div>
</div>
<div class="control-group">
<%= f.label :shape, 'Shape (KML file)', :class => 'control-label' %>
<div class="controls">
<%= f.file_field :shape, :class => 'file_field' %>
</div>
</div>
<div class="control-group">
<%= f.label :enabled, :class => 'control-label' %>
<div class="controls">
<%= f.check_box :enabled, :class => 'checkbox' %>
</div>
</div>
<!-- handles the list of stops -->
<div class="stops_list" id="stops_list">
<%= f.label "Stops", :class => 'control-label'%>
<% params.merge!(:trips => {}) %>
<% puts params.inspect %>
<% trips = Trip.where('route_id = ?', #route.id).order('trips.order ASC') %>
<% #trips.each do |trip| %>
<%divId = 'stop'+trip[0].to_s %>
<div class="controls" id= <%= divId %>>
<%= f.label trip[0].to_s + '.', :class => 'control-label'%>
<%= collection_select params[:trips], trip[0].to_s, Stop.order('name ASC').all, :id, :name, {:selected => #trips[trip[0]]} %>
</div>
<% end %>
<%= button_to_function 'Remove stop',
'if(confirm("Really?")) {
$("#stops_list div").last().remove();
$.get("/routes/removeLastStop/'+(#route.id.to_s)+'");
}'%>
</div>
<!-- adds submit button -->
<div class="form-actions">
<%= f.submit nil, :class => 'btn btn-primary' %>
<%= link_to t('.cancel', :default => t("helpers.links.cancel")),
routes_path, :class => 'btn' %>
</div>
<% end %>
Firstly you can add to Route class:
class Route < ActiveRecord::Base
has_many :trips
end
Firstly i'd like to advise you using decorators, inserting Models in Views is not the best practice.
Secondly you can use gem 'draper' and in RouteDecorator class you can add functions for creating something you want to use or display.
Thirdly you'd better use:
<div class="controls" id="stop<%= trip[0].to_s %>">
Forthly it would be better to use paths in REST-style:
/routes/2/stop/remove
/routes/2/stop/add
Fifthly can you give code of all form?
Probably we need to refactor it to look better and be easier for understanding.

Ruby on Rails: How to purge entries from search box

I am using a search box using the following form:
<div id='search-box'>
<%= form_tag "/search", :method => :get, :id => "search-form" do %>
<%= text_field_tag :q, params[:q], {:id => "search-text", :placeholder => "SEARCH FOR PRODUCTS"} %>
<%= submit_tag "Go" %>
<%end%>
</div>
The problem is that whenever I type something in the search box, it shows a dropdown with previous queries. I do not want to store the queries and show the dropdown. How can I purge the queries?
use autocomplete="off":
<%= text_field_tag :q, params[:q], {:id => "search-text", :placeholder => "SEARCH FOR PRODUCTS", :autocomplete => 'off'} %>

Accessing elements between forms

I am trying to access the value of an element in a different form. More specifically I have two forms, one normal html form which submits the information, and an ajax form that updates a field in the database. I want the ajax form to take the value of an element in the normal form, but I have no idea how to accomplish that. Here is my current setup:
Message View
<%= form_for #message do |f| %>
<%= f.text_field :to %>
<%= f.text_area :body %>
<%= f.submit "Send Message" %>
<% end %>
<%= form_for :save, :url => save_message_path(), :remote => :true do |f| %>
<%= f.submit "Save" %>
<% end %>
Message Controller
def save
account.message = params[:body]
end
But the :body param is in the other form so it sets account.message to nil because the ajax form did not have a body parameter. I would like it so the ajax form can submit the value of the body element.
Since the form is edited on the client side, you'll have to write this functionality in javascript.
It is relatively straightforward to copy the value of the message body into a hidden field and submit the Ajax form. This would be most easily accomplished by adding an id your ajax form as follows:
<%= form_for :save, :url => save_messages_path(), :remote => true, :id => 'ajaxform' %>
<%= hidden_field_tag 'hidden_message' %>
Then in javascript you could do the following:
$(document).ready(function(){
$("#ajaxform").submit(function() {
$("#hidden_message").val($("#message_body").val());
return true;
});
}
You can add a hidden field body in your ajax form, and use an onsubmit event to populate it with the value of the body field from the normal form before the ajax request is sent. It would look more or less like this:
<%= form_for #message do |f| %>
<%= f.text_field :to %>
<%= f.text_area :body, :class => 'main_body_field' %>
<%= f.submit "Send Message" %>
<% end %>
<%= form_for :save, :url => save_message_path(), :remote => :true, :id => 'ajax_form' %>
<%= f.hidden_field :body, :class => 'hidden_body_field' %>
<%= f.submit "Save" %>
<% end %>
javascript (with jQuery):
$(function() {
$("ajax_form").submit(function() {
// copy body value from first form to the second one
$('.hidden_body_field').val($('.main_body_field').val());
return true;
}
}

Combining link_to with render :partial

I would like to combine 2 commands into 1, if its possible.
<%= render :partial => 'shared/logo' %>
<%= link_to 'Dashboard', root_url %>
I would like to call the logo in the shared directory and have it be a link at the same time.
How would I write this?
This should do it:
<%= link_to render(:partial => 'shared/logo'), root_url %>