james james - 1 year ago 92
Javascript Question

document.ready not firing?

This is NOT a case of not having jQuery loaded, but I do feel like I'm missing something else that's simple... On this staging site: https://hidden-tundra-8656.herokuapp.com/orders, once the page finishes loading, the "Camping & backpacking" should be auto-selected.

This is the code:

$(document).ready( function() {
console.log("about to trigger initial click")

It's definitely not happening. Any thoughts? The only thing that I can think of is that the
s are interpolated from Ruby, see view code below, so maybe that's causing it?

<div class="row">
<% @item_categories.each do |ic| %>
<div class="col-xs-6 category-box">
<div class="row category-row">
<div class="col-xs-12 table-display category-selector text-center" data-id="<%=ic.id%>">
<span class="labeler-response table-cell-display">
<%= ic.name %>
<% end %>

A little bit more info.

in the code is not triggered, and
is defined. ALL of the other jquery on the page is working perfectly.

On this page, it is loading the
and a separate
that contains the code in question. It loads jquery first, then
. For argument's sake, I just tried to load the code snippet into
and it didn't work there either. This works fine in local server.

Answer Source

If you're using Turbolinks (default if you setup a rails project), you should use page:load as an event.

$(document).on("page:load", function() {
  console.log("about to trigger initial click");


If you're in production mode, please make sure that you run bin/rake assets:precompile to keep your assets up-to-date.