Specify spinner while loading content with Rails UJS

Question

I'm using Rails UJS to load partials into a container depending on the link I click. I've got everything working (see my answer to my question here for code) but I'd like to add a spinner while the content is loading. How can I go about doing this? I found a brief example in Simone Carletti's post on UJS but can't seem to implement it properly.

Here's the HTML generated:

<div id="tabs">
  <ul id="infoContainer">
    <li><a href="/profiles/1/profile_reviews" class="active" data-remote="true" id="profile_loader">Reviews</a></li>
    <li><a href="/profiles/1/profile_about" class="inactive" data-remote="true" id="profile_loader">About</a></li>
    <li><a href="/profiles/1/profile_credits" class="inactive" data-remote="true" id="profile_loader">Credits</a></li>
    <li><span id="loading">Loading...</span></li>
  </ul>
  <div id="tabs-1">
    # load data from partials here
  </div>
</div>

Can anyone help me out?

Doesn't really matter to me; I'm just sayin'. Still, without knowing what's happening, if there's anything in the Firebug console, blah blah blah, it's much harder to help. — Dave Newton, Oct 31 '11 at 01:37
No you're right. I appreciate it - helps me ask better, more-informed questions! — tvalent2, Oct 31 '11 at 01:38
Asking the right question is often harder than answering it! — Dave Newton, Oct 31 '11 at 01:39
So true. I attempted to ask it in another question though: http://stackoverflow.com/questions/7949978/showing-spinner-for-rails-3-ujs-gets-type-error — tvalent2, Oct 31 '11 at 16:23

score 2 · Accepted Answer · edited May 23 '17 at 11:50

2

See this SO answer for more info, but the easiest thing to do is to bind to the ajax:before and ajax:after events to show/hide the spinner.

Whether to do this via the javascript_event_tag or by binding in an external JS file is a different issue.

edited May 23 '17 at 11:50

Community

1
1

answered Oct 30 '11 at 15:22

Dave Newton

152,765
23
240
286

Thanks. I just updated this with more code to show what I've tried. – tvalent2 Oct 31 '11 at 01:26

Specify spinner while loading content with Rails UJS

1 Answers1