jQuery Rails autocomplete gem, no response - ruby-on-rails

I'm using rails3-jquery-autocomplete gem to try to complete a form. However, I'm just getting no response whatsoever.
Alright, here it goes:
In my view:
<%= form_tag chats_path do %>
<%= autocomplete_field_tag 'name', '', chats_autocomplete_chat_name_path %>
<% end %>
In my ChatsController:
autocomplete :chat, :name
In my routes:
get "chats/autocomplete_chat_name"
And finally in my application.js:
//= require autocomplete-rails
Although I'm sure the javascript is at least loading, since I put an alert to let me know that autocomplete-rails.js was loading. Any ideas?

Try using chrome -> tools -> developer tools and open up the "networking" tab. Then try again and see if you're form is being sent and if so, what the response is.

Related

Rails bootstrap datepicker - Calendar is covered by drop down list when adding new record

I have some strange behavior happening with bootstrap datepicker in a rails form. I'm using form_for in a partial for edit and new. When editing, the calendar shows perfectly when clicking on the date field but when adding a new record, the calendar is covered over by a dropdown list containing about 6 dates recently entered via the form. The calendar control is also open under the list. I can see the right edge of it. Also, when I move the browser window around or go to another open app and then back to the browser, only the calendar is there...the drop down list disappears. So odd!
I've been searching for a solution for several weeks and have scoured the internet and the datepicker documentation but just can't figure this out. Any guidance appreciated!
Here is the text_field within my form_for.
<div class="field">
<%= f.text_field :visit_date, {"data-provide" => 'datepicker',
"data-date-format" => "yyyy-mm-dd", "data-date-autoclose" =>
"true"} %>
<%= f.text_area :location, placeholder: "Add visit location..." %>
</div>
I have the gem in my gem file as:
gem 'bootstrap-datepicker-rails', '~> 1.8.0'
I have the following in my application.js file:
//= require bootstrap-datepicker
And I have this in my application.css.scss file:
*= require_tree .
*= require_self
*= require bootstrap-datepicker3
*/
one of alternatif solution for your problem is to turned off autocomplete field, you can turned off html autocomplete from previous input with this command below
<%= form_for #your_data , :html => {:autocomplete=> 'off'} do |f| %>

UnknownFormat Error When Doing an AJAX Search

I wish to have a little search box, which will allow the user to search other users by name, with the results showing in the box in a sort of list. Much like how, on a site like amazon, you can type a search into the bar and it will have a dropdown, except on mine I am not doing "autocomplete" (at least not yet)
At the moment, however, when I try to search, it says "ActionController::UnknownFormat in ChatRoomsController#search_users", with an explanation:
ChatRoomsController#search_users is missing a template for this request
format and variant. request.formats: ["text/html"] request.variant: []
NOTE! For XHR/Ajax or API requests, this action would normally respond
with 204 No Content: an empty white screen. Since you're loading it in a
web browser, we assume that you expected to actually render a template,
not nothing, so we're showing an error to be extra-clear. If you expect
204 No Content, carry on. That's what you'll get from an XHR or API
request. Give it a shot.
So it seems to be saying that this isn't an AJAX request, but I have have pretty much copied my code from the RailsCast on AJAX searching (just removed some pagination bits), so this confuses me.
Here are the relevant parts of my code:
# chat_rooms/show.html.erb
<%= form_tag search_path, :id => "search", :method => 'get' do %>
<%= text_field_tag :search, params[:search] %>
<%= submit_tag "Search for User", :name => nil, class: "button-butt" %>
<% end %>
<% for result in #users_results %>
<%= result.name %>
<% end %>
and the controller:
# chat_rooms_controller.rb
def search_users
#users_results = User.search(params[:search])
end
the model's search method:
# user.rb
def self.search(term)
where('name LIKE ?', "%#{term}%")
end
I think my routing is OK, but just in case it isn't:
# routes.rb
get '/search_users', to: 'chat_rooms#search_users', as: 'search'
and finally, the javascript:
#application.js
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
$("#search input").keyup(function() {
$.get($("#search").attr("action"), $("#search").serialize(), null, "script");
return false;
});
Any help would be appreciated.
# routes.rb
get '/search_users', to: 'chat_rooms#search_users', as: 'search'
Since your routes.rb specifies that you will have a search_users action in ChatRoomsController and it(action) seems to be present.
When request arrived from the form, it landed on that action but, since the template named search_users.html.erb is missing, its displaying this error.
Solution
Either handle the request and respond with a template mentioned in the error message; or, rename and redesign the routes and controller.
Edit: 1
I just want to send the search request, and have the results pop into the list below the searchbar if you see what I mean.
If so, do following:
# chat_rooms_controller.rb
def search_users
#users_results = User.search(params[:search])
render :show
end
Plz comment, if its not helping.

Input mask for phone form field in rails view

I have a customer contact form in my app which, of course, requires a phone input. I am running Rails 3.2.13 and using Zurb Foundation. I am hoping to find a gem that offers an input mask in the form '(999) 999-9999' that I can call. My data is really local so the US formatted numbers is all that I need.
I am able to perform the validation on the field but wanted to keep the users within the tighter boundaries of an input mask. This is what I have at the moment.
<div class="large-4 columns"><%= f.telephone_field :phone, :placeholder => "Phone - (123) 456-7890" %></div>
Any great gems for this, or perhaps a jQuery plugin that you like?
Cheers!
-Edit
So here is the full answer for what I needed to accomplish. Just in case anyone is looking for a quick fix. This is the code in my _form.html.erb view file:
<div class="large-2 columns">
<%= f.text_field :phone, :id => "phone", :placeholder => "Primary Phone"%>
</div>
Here is the code in my coffee file in my assets/javascripts folder:
$ ->
$("#phone").mask("(999) 999-9999")
You need to download the appropriate jquery.maskedinput.js file from the link #vinodadhikary mentions below. Then you must require the file somewhere below the jquery file in the list of dependencies in your application.js file like so:
//= require jquery
//= require jquery_ujs
//= require foundation
//= require jquery.maskedinput
//= require_tree .
That's about it. If you notice anything amiss, please let me know and I'll edit.
I have been using the plugin http://digitalbush.com/projects/masked-input-plugin and it works pretty well.
I have a lot of fields with different masks so I use this method in my application coffescript.
$( "[data-mask]").each (index, value) ->
element = $(value)
element.mask($(value).data('mask'))
Now I can just set a data-mask attribute on any of my fields::
<%= f.text_field(:phone, data: { mask: '(999) 999-9999' }) %>
I hope this helps someone!

How to create dropdown menu for the following code in Rails 3?

Consider an HTML list of links:
User 1 name link<br>
User 2 name link<br>
This code generates the list:
<% User.all.each do |user| %>
<%= link_to user.name + " link", d_population_path(user.id) %><br>
<% end %>
The relevant route is:
match 'd_population/:this_client', :to => 'dashboard#population', :as => 'd_population'
I would like to use an HTML dropdown to make the same HTTP request.
Is it possible to use a dropdown to make a HTTP request that looks like /d_population/1?
I attempted to use form_tag and select_tag to generate the dropdown and pass this_client as a parameter, but kept getting routing errors. Do you need to add a route d_population/ to make a dropdown work?
Thanks.
here are a few resources to help you get started with Dropdowns and Menu's
Tabs on Rails is an awesome Gem that will help you generate Li menu's in Rails http://www.simonecarletti.com/code/tabs_on_rails/
Bootstrap is a UI Framework, developed by Twitter http://twitter.github.com/bootstrap/
I've successfully implemented both of these in a current project that i've been working on.

RoR facebox for prototype

I've got facebox working using the following tags in my rails app
<%= link_to 'test' some_path, :rel => 'facebox' %>
Now that works perfect if the page is already loaded.
However, I have ajax updates on certain parts of the page which contain new links like the one shown above.
When you click the links from an ajax update facebox doesn't work follows on to the template.
I believe since the page doesn't refresh the source code is the same and :rel => 'facebox' doesn't work.
Does anyone have any advice on how I can get this to work without refreshing the page?
I've tried this in a method in a controller.
render :update do |page|
page << "
facebox.loading();
facebox.reveal('text', null);
new Effect.Appear(facebox.facebox, {duration: .3});
"
end
However, for some reason in chrome and IE the facebox appears for a brief second and then disappears.
Any advice? I've been banging my head off the wall all day.
Thank you
All you need to do, is ensure that you're making a javascript call to facebox somewhere in the view of your AJAX response: arguably the best location would be in the layout file. Just make sure that you include the following:
#app/views/layouts/ajax.html.erb
#...snip...
<% javascript_tag :defer => 'defer' do -%>
jQuery(document).ready(function($) {
$('a[rel*=facebox]').facebox();
})
<% end -%>
or with prototype (untested):
#app/views/layouts/ajax.html.erb
#...snip...
<% javascript_tag :defer => 'defer' do -%>
document.observe("dom:loaded", function() {
$$('a[rel*="facebox"]').facebox();
});
<% end -%>
This will ensure that any new links that appear on the page, as part your AJAX updates, will be handled by facebox.

Resources