Ruby on Rails with jQuery

Hi I just came across an article on how to combine Rails with jQuery.
http://blog.bernatfarrero.com/category/ror/
I followed the instructions, but I could not get it to work (instead of using ajax rails, I tried a non-javascript way to process the request). After I downloaded the source code, I found out what the problem is. In the source in public / javascripts there is a jquery-rails.js file that is associated with the line

javascript_include_tag "jquery-rails.js" 

in application.html.erb. If I change the name of this file in the line above, it no longer works. So I tried to change the original name of the loaded form of the driver file here: http://docs.jquery.com/Downloading_jQuery#Download_jQuery (many different versions) to the one I found in the source. Of course, I placed it in the same directory. And again, it could not work ... So, finally, I compared the files. That I said that the file from the source was much shorter. Well, I'm a real newbie to JS, so I have to ask you for help here. Why is this not working? How to get Rails to work with jQuery source driver?
Till

Below you can see "jquery-rails.js" from the source

jQuery(function ($) {
var csrf_token = $('meta[name=csrf-token]').attr('content'),
    csrf_param = $('meta[name=csrf-param]').attr('content');

$.fn.extend({
    /**
     * Triggers a custom event on an element and returns the event result
     * this is used to get around not being able to ensure callbacks are placed
     * at the end of the chain.
     *
     * TODO: deprecate with jQuery 1.4.2 release, in favor of subscribing to our
     *       own events and placing ourselves at the end of the chain.
     */
    triggerAndReturn: function (name, data) {
        var event = new $.Event(name);
        this.trigger(event, data);

        return event.result !== false;
    },

    /**
     * Handles execution of remote calls firing overridable events along the way
     */
    callRemote: function () {
        var el      = this,
            data    = el.is('form') ? el.serializeArray() : [],
            method  = el.attr('method') || el.attr('data-method') || 'GET',
            url     = el.attr('action') || el.attr('href');

        if (url === undefined) {
          throw "No URL specified for remote call (action or href must be present).";
        } else {
            if (el.triggerAndReturn('ajax:before')) {
                $.ajax({
                    url: url,
                    data: data,
                    dataType: 'script',
                    type: method.toUpperCase(),
                    beforeSend: function (xhr) {
                        el.trigger('ajax:loading', xhr);
                    },
                    success: function (data, status, xhr) {
                        el.trigger('ajax:success', [data, status, xhr]);
                    },
                    complete: function (xhr) {
                        el.trigger('ajax:complete', xhr);
                    },
                    error: function (xhr, status, error) {
                        el.trigger('ajax:failure', [xhr, status, error]);
                    }
                });
            }

            el.trigger('ajax:after');
        }
    }
});

/**
 *  confirmation handler
 */
$('a[data-confirm],input[data-confirm]').live('click', function () {
    var el = $(this);
    if (el.triggerAndReturn('confirm')) {
        if (!confirm(el.attr('data-confirm'))) {
            return false;
        }
    }
});


/**
 * remote handlers
 */
$('form[data-remote]').live('submit', function (e) {
    $(this).callRemote();
    e.preventDefault();
});

$('a[data-remote],input[data-remote]').live('click', function (e) {
    $(this).callRemote();
    e.preventDefault();
});

$('a[data-method]:not([data-remote])').live('click', function (e){
    var link = $(this),
        href = link.attr('href'),
        method = link.attr('data-method'),
        form = $('<form method="post" action="'+href+'"></form>'),
        metadata_input = '<input name="_method" value="'+method+'" type="hidden" />';

    if (csrf_param != null && csrf_token != null) {
      metadata_input += '<input name="'+csrf_param+'" value="'+csrf_token+'" type="hidden" />';
    }

    form.hide()
        .append(metadata_input)
        .appendTo('body');

    e.preventDefault();
    form.submit();
});

/**
 * disable-with handlers
 */
var disable_with_input_selector = 'input[data-disable-with]';
var disable_with_form_selector = 'form[data-remote]:has(' + disable_with_input_selector + ')';

$(disable_with_form_selector).live('ajax:before', function () {
    $(this).find(disable_with_input_selector).each(function () {
        var input = $(this);
        input.data('enable-with', input.val())
             .attr('value', input.attr('data-disable-with'))
             .attr('disabled', 'disabled');
    });
});

$(disable_with_form_selector).live('ajax:after', function () {
    $(this).find(disable_with_input_selector).each(function () {
        var input = $(this);
        input.removeAttr('disabled')
             .val(input.data('enable-with'));
    });
});

});

+3
source share
2 answers

, 3, jquery jquery-rails gem, ( gem 'jquery-rails') Gemfile, bundle, rails generate jquery:install jquery !

+9

UJS Ruby on Rails jQuery, :

  • jQuery . jQuery jQuery.com javascript_include_tag Google CDN, ( )

  • jQuery Rails. Rails jQuery Rails , jQuery. jQuery Rails (, ) javascript_include_tag .

+2

All Articles