Here’s how you can display a spinner on each Ajax request in Ruby on Rails 3 using jQuery and HTML5 “data-” attributes.

The setup part

//public/javascripts/application.js
//"ajax:beforeSend" and "ajax:complete" event hooks are provided by Rails 3's jquery-ujs driver.
$("*[data-spinner]").live('ajax:beforeSend', function(e){
  $($(this).data('spinner')).show();
  e.stopPropagation(); //Don't show spinner of parent elements.
});
$("*[data-spinner]").live('ajax:complete', function(){
  $($(this).data('spinner')).hide();
});

#app/helpers/application_helper.rb
def spinner_tag id
  #Assuming spinner image is called "spinner.gif"
  image_tag("spinner.gif", :id => id, :alt => "Loading....", :style => "display:none")
end

The effect part

Now in whichever form or link you’d like to add spinner support just add one “data-spinner” attribute and the spinner image.
Here’s an example -

jQuery UI dialog allows you to display any content in a popup box, given the content is already present somewhere within page (e.g., in the DOM tree). However, you may want to display content in a popup box that has to be fetched from the server.

Now, here is how you can display a URL into a modal window (in-page popup) with jQuery UI dialog. Do note that this only works for pages hosted on the same domain because of same origin policy