Rails assets and javascript integration

Question

Premisse: I have scant knowledge of javaScript.

In a rails layout, the following script functions:

<script>
  $(function() {
    $( "#date_available_dal" ).datepicker({dateFormat: 'yy-mm-dd', showButtonPanel: true});
    $( "#date_available_al" ).datepicker({dateFormat: 'yy-mm-dd', showButtonPanel: true});
  });
</script>

But if I place the same code, while stripping the open and close script tags, in a .js file within the assets/javascripts file, the browser loads the file, but [as Curly would say] nothing happens.

I've experienced this on many an occasion & it impedes me from using the pipeline properly. What is rails doing in the background that may change this script's behaviour?

In the same line of thinking, if I were to append the locale given an application method

  def set_locale
    if user_signed_in?
      I18n.locale = current_user.idioma.code.downcase
    else
      I18n.locale = params[:locale] || I18n.default_locale
    end
  end

to

datepicker({dateFormat: 'yy-mm-dd', regional[ #{set_locale} ]

how would this code be handled between the stacks?

Update

Presently in development mode, the browser is receiving the file with the following:

  $(function() {
$( "#date_available_dal" ).datepicker({dateFormat: 'yy-mm-dd', minDate: 0, numberOfMonths: 3, showButtonPanel: true});
$( "#date_available_al" ).datepicker({dateFormat: 'yy-mm-dd', minDate: 1, numberOfMonths: 3, showButtonPanel: true});
  });

Stick to one question at a time. Regarding the first question, there is nothing obviously wrong with the code you posted, and it's impossible to say what the asset pipeline is doing without seeing the output. — Josef Engelfrost, Jun 20 '14 at 09:51
Updated question to include code. (Yes, understood about the multiple questions. My assumption is that they are linked somehow) — Jerome, Jun 20 '14 at 09:59
Can you see any script errors in the browser console? Are those the only four lines in the file served to the browser? How and when are you loading jQuery? — Josef Engelfrost, Jun 20 '14 at 10:49
jQuery is in the sequence of files being loaded, but AFTER datepicker, even though I state in application.js //= require jquery //= require jquery_ujs //= require jquery.ui.datepicker no script erros linked ot this script per se. //= require jquery.prettyPhoto — Jerome, Jun 20 '14 at 11:02
That is apparently the problem. If I add a manual tag <%= javascript_include_tag "datepicker" %> after the <%= javascript_include_tag "application" %> it runs. require_tree in relation to the other requires also complicates matters. It is now ridiculous in that i have to=hose 4 lines of JS in twice! — Jerome, Jun 20 '14 at 11:21
Does the following answer solve the javascript load order issue? http://stackoverflow.com/questions/6149961/rails-3-1-asset-pipeline-and-manually-ordered-javascript-requires#answer-6482902 — Josef Engelfrost, Jun 20 '14 at 16:44
Yes! It actually does. It is doubly useful because, based on the application context, there are different valid paths to follow. require_tree . can be very dangerous indeed. — Jerome, Jun 20 '14 at 17:00

Jerome · Accepted Answer · 2014-06-21T12:38:21.360

Answer to main question: Josef has identified the issue. The javascript order is the point to resolve in this case.

I'll add a second observation: require_tree . can be very tricky between what it does (looks at file alphabetically), what one declares and so forth. The bigger the application with heterogeneous use of JSes, the more one ought to steer away form using it, generally declaring what is really needed in individual cases.

As to the second question, given these pages are indexed, I'll go againt proper practice and post the answer nonetheless.

jQuery's datepicker has its own I18n fileset that are defined as datepicker-de.js . download the necessary files form github and save them where required. I've defined user's language in field idioma_id, with its Idoma model, allowing me to state

<% if user_signed_in? %>
  <%= javascript_include_tag ("datepicker-" + "#{current_user.idioma.code.downcase}") %>
<% elsif params[:locale].present? %>
  <%= javascript_include_tag ("datepicker-" + "#{params[:locale]}") %>
<% else %>
<% end %>

the last else statement is a shortcut that applies if your default locale is en. datepicker's default is en and therefore is already loaded.

Rails assets and javascript integration

1 Answers1