2014-10-21.md

Error handers for rails ujs actions

If you include jquery_ujs, through jquery-rails gem, then you can use those funky data-remote methods. One common thing that I have seen (maybe its just me), is we let such links/buttons/forms submit request to server, but we dont check for any errors.

Infact, that gem triggers nice events which can be hooked onto. This is how we can install a error handler, which displays a flash message if data-remote ajax request did not succeed.

# bind global ajax error handler for showing better errors
# https://github.com/rails/jquery-ujs/wiki/ajax

defaultRailsUjsErrorHandler = (xhr, status) ->
  message = JST['templates/flash']
    message: 'Something went wrong. Please try again'
    alert_class: 'alert-error'
  $('#flash-notice').replaceWith(message)


$(document).on 'ajax:error', defaultRailsUjsErrorHandler

And this is the jst template for flash notice

<div id="flash-notice" class="alert-container">
  <div class="container">
    <div class="alert <%- alert_class %>">
      <button type="button" data-dismiss="alert" class="close">×</button>
      <%- message %>
    </div>
  </div>
</div>

There are other intersting events that jquery_ujs fires. You can read more about it here.