rails4 ajax通信のcallbackが取得できません

Question

###前提・実現したいこと

• Ruby 2.3.0
• Rails 4.2.6
• jquery-rails (4.1.1)
• jquery-ui-rails (5.0.5)

ajax通信を用いてformにて投稿した際にcallbackのsuccessを取得したいです。

###発生している問題・エラーメッセージ

formからajax通信を行った際のcallbackが取得できません。
ajax通信自体は成功しており、画面を部分的に更新する事はできております。

###該当のソースコード

■ _comments.html.erb

ajaxにて部分的に更新されるviewです。
「<div id="comment<%= wall.id %>" class="comment"> 」の部分が更新対象です。

<% if wall.comments.length > 0 or current_user %>
  <div id="wall-comments">   
    <div id="comment<%= wall.id %>" class="comment"> 
    <!-- comment -->   
    <%= render :partial => "/shared/comments_detail", :locals => {:wall => wall } %>   
    <!-- comment -->   
    </div>   
  </div> 
<% end %>  

■ _comments_detail.html.erb

formにてCommentsController#createにpostしています。
この際に「:remote => true」を設定しajax通信にしています。

<%= form_for @comment, :html => { id: "new_comment_#{wall.id}", :class => 'form-ajax', :remote => true } do |f| %>
  <div class="postbox">  
    <div role="alert"></div> 
    <div class="avatar"> 
      <span class="user">
          <%= user_image_link(wall.user, "user-avatar") %> 
      </span>
    </div>   
 
    <div class="textarea-wrapper no-border" data-role="textarea" dir="auto"> 
      <%= f.hidden_field :wall_id %> 
      <%= f.hidden_field :user_id %> 
      <%= f.text_area :body, :class => 'sm-form-control no-resize', :placeholder=> get_comment_placeholder, "data-wall-id" => wall.id %> 
    </div>   
    <% if request.smart_phone? or request.tablet? %> 
      <%= submit_tag "送信", class: "btn btn-primary btn-xs" %>  
    <% end %>
  </div> 
<% end %>

■ comments_controller.rb

createのactionです。

class CommentsController < ApplicationController

  def create

    # コメント登録
    @comment = Comment.new(comment_params)

    ActiveRecord::Base.transaction do
      @comment.save!
    end

    # wall_idセット
    @wall_id = @comment.wall_id
  end

  def comment_params  
    params.require(:comment).permit(:wall_id, :user_id, :body)
  end   
end

■ create.js.erb

下記jsにて部分的に画面を更新しています。

$("#comment<%= escape_javascript(@wall_id.to_s) %>").html(
  "<%= escape_javascript(render :partial => '/shared/comments_detail') %>"
);

■ comments.js

「form-ajax」のclassが設定されたformのcallbackを取得するように設定しています。

$('.form-ajax').on("ajax:success", function(evt, data, status, xhr){
  alert("test");
});

###試したこと

ajax通信時のdataTypeにより取得できないという記事を見つけました。
http://stackoverflow.com/questions/16006784/rails-ajaxsuccess-callback-not-triggering-in-production

試しに「dataType: 'html'」にしたところcallbackは取得できるようになったのですが
逆に画面を部分的に更新する事ができなくなりました。
ただしこの状況でもrailsにはajax通信でアクセスしておりrenderはRendered comments/create.js.erbを返しています。

【パターン1】

■ application.js

dataTypeを'html'に変更
callbackは拾えるようになるのですが、画面が更新されなくなります。

$(document).ready(function () {
  $.ajaxSetup({
    dataType: 'html'
  });
});

■ development.log

dataTypeを'html'に変更した際のログです「CommentsController#create as HTML」となっておりますが
renderdではcreate.js.erbを返しています。

Started POST "/comments" for 192.168.11.147 at 2016-07-22 16:41:24 +0900
Processing by CommentsController#create as HTML
・
・
・
  Rendered shared/_comments_detail.html.erb (52.3ms)
  Rendered comments/create.js.erb (62.0ms)
Completed 200 OK in 140ms (Views: 68.2ms | ActiveRecord: 42.3ms)

【パターン2】

dataTypeを'script'に変更
画面が更新されるのですが、callbackが取得できなくなります。

■ application.js

$(document).ready(function () {
  $.ajaxSetup({
    dataType: 'script'
  });
});

dataTypeを'script'に変更した際のログです「CommentsController#create as JS」となっており
renderdでcreate.js.erbを返しています。

Started POST "/ja/comments" for 192.168.8.22 at 2016-07-22 17:01:15 +0900
Processing by CommentsController#create as JS
・
・
・
  Rendered shared/_comments_detail.html.erb (21.6ms)
  Rendered comments/create.js.erb (23.9ms)
Completed 200 OK in 108ms (Views: 26.9ms | ActiveRecord: 54.1ms)

補足情報

影響があるか分からないですが1ヶ月ほど前にrailsをバージョン3.2.11から4.2.6にアップグレードしています。
3.2.11の頃にはcallbackを使用していなかったため、その当時に設定したとして動いたかは分かりません。

お手数をおかけしますが、ご回答よろしくお願い致します。

Answer 1

自己解決しました。
（でも理由はわかっていません。どなたかご教授頂けると助かります。）

callbackの記述を変更したところ正常に動作するようになりました。

■ 変更前

$('.form-ajax').on("ajax:success", function(evt, data, status, xhr){
  alert("test");
});

■ 変更後

$(document).bind('ajaxSuccess', '.form-ajax', function(event, jqxhr, settings, exception){
  alert("test"); 
});

1. 「ajax:success」を「ajaxSuccess」に変更
2. 「$('.form-ajax').on」を「$(document).bind」に変更

ちなみに「$(document).on」では動作しませんでした。
また「$(document).bind('ajax:success'」でも動作しませんでした。
「$(document).bind('ajaxSuccess'」のみ正常に動作しました。