I have an application which uses some Javascript for basic Ajax requests such as autocompletion and live search. For example I implemented live search in the following way; I spotted some potential issue and would like to talk with you about it, so to have a better code.
app/controllers/company_controller.rb
def livesearch
@companies = Company.search(params[:query])
render :partial => "companies", :locals => {:companies => @companies}
end
app/views/companies/_companies.html.haml
- if companies.empty?
None
- else
%table#company_list
%tr
%th Name
%th Description
%th Products
%th
= render companies
app/views/companies/_livesearch_box.html.haml
= content_for :scripts, "jlivesearch companies"
= form_tag "#", :autocomplete => :off, :remote => true do
%span.light
Search:
= text_field_tag :search
:javascript
$('#search').livesearch({
searchCallback: update_listed_companies,
queryDelay: 200,
innerText: "Search companies"
});
public/javascripts/companies.js
function update_listed_companies(query) {
if(typeof query == "undefined")
query = "";
$("#company_list_container").showWith(
"/companies/livesearch?query=" + query,
false
);
}
public/javascripts/application.js
(function($) {
$.fn.showWith = function (what, popup) {
element = this;
$.get(what, function(data) {
element.html(data);
if(popup)
element.bPopup();
});
return element;
};
})(jQuery);
Here are the things that make me suspicious about the optimality of my code:
- I have Javascript code in
_livesearch_box.html.haml
. - Even if I put it in a
public/javascripts/companies_livesearch.js
I would have to hardcode the#search
part in it. - I have
#company_list_container
(which is the div in which_companies.html.haml
is rendered) hardcoded inpublic/javascripts/companies.js
. - I have the path
/companies/liveseach?query=
hardcoded inpublic/javascript/companies.js
. - I'm not using CoffeeScript, mainly because it expects (at least if you use Barista) to find pure javascript code somewhere (e.g. in
app/coffeescripts/
) and compiles it inpublic/javascripts
. But in my application I also have some.js.erb
file in myapp/views/companies
; for example, I have a voting system that uses the following in app/views/companies/_vote.js.erb:$("#vote_link_<%= escape_javascript(@company.id.to_s) %>").html("<%= escape_javascript(vote_link_for(@company)) %>")
To replace the "Vote this company" link with the "Unvote this company" one (and vice-versa) with an Ajax request and is rendered by thevote
andunvote
actions in the controller. I know that there is coffee-haml-filter that compiles CoffeeScript inside haml files but it's not what I exactly need and is usually deprecated and regarded as something dirty (?).
So the questions are at least:
- How to have CoffeeScript in my
app/views/*/*.js.*
? - Should I have
app/views/*/*.js.*
files at all? - How to remove all those element ids and those paths hardcoded in javascripts in the most efficient and elegant way?
Sorry for the long question and thanks for getting to the end of it!