Prototype, and JQuery inside Rails Application

By -
It has become common practice to use JQuery as the javascript library of choice for Ruby on Rails  applications with the latest versions of rails using JQuery.  But If you have an Rails application that is already using Prototype, it may create problems to replace that with JQuery . And sometimes, you just simply need both to work at the same time.

Use Prototype/Scriptaculous with JQuery

 First, in our application layout, we’re going to get rid of <%=javascript_include_tag :defaults %> and include each javascript file explicitly just to make things a little easy to understand and a little more straight forward.

 So we have replaced defaults with 


<%= javascript_include_tag 'prototype', 'scriptaculous', 'application' %>

Now, we’ll add in JQuery, by downloading the latest version of JQuery from the JQuery Download page from the JQuery Website

<%= javascript_include_tag 'prototype', 'scriptaculous', 'jquery', 'jquery-ui', 'application' %>
 

Right under that line, in your Rails application layout, we’ll insert the one-liner that makes JQuery play nicely with Prototype, YUI, etc.



This will come under script tag 




var $j = jQuery.noConflict();




This allows jquery to be called along with scriptaculous without any conflicts,the only difference is all jquery functions should be called with $j instead of $



e.g. $j('#div_id').stuff instead of $('#div_id').stuff



If you simply want the ability to use both libraries together in your application




Effect.Fade($('element_id'));
$j('#element_id').show();




Notice the first line uses the Prototype element id selector, $ with a Scriptaculous effect, and the second line uses the new noConflict JQuery selector $j. 







































Comments











Post a Comment






























Popular posts from this blog









Inserting and Moving elements inside Ruby Array







By







-















Here's is an array with 5 elements  2.1.2 :001 > arr = ["a", "b", "c", "d", "e"]  => ["a", "b", "c", "d", "e"]  Lets look at few different cases  Insert a new element at starting position  Using unshift 2.1.2 :002 > arr.unshift("f")  => ["f", "a", "b", "c", "d", "e"]  Using insert 2.1.2 :005 > arr.insert(0, "f")  => ["f", "a", "b", "c", "d", "e"] In the above example 0 is the position(index)  Move existing element from one position to another   The element in this case is "e"  Using uniq to show only unique elements  2.1.2 :009 > arr.insert(0, "e").uniq  => ["e", "a", "b", "c", "d"]  With uniq we are only showing unique records but the element is listed 








Read more










Difference between Validations, Callbacks and Observers







By







-















 Validations allow you to ensure that only valid data is stored in your  database.   Example:    validates_presence_of :user_name, :password   validates_numericality_of :value   We can write custom validation also as   def validate    errors.add(:price, “should be a positive value”) if price.nil?|| price < 0.01  end    Callbacks and observers allow you to trigger logic before or  after an alteration of an object’s state.   Callbacks  are methods that get called at certain moments of an  object’s  life cycle. With callbacks it’s possible to write code that  will run  whenever an Active Record object is created, saved, updated,  deleted,  validated, or loaded from the database.   Callbacks are hooks into the life cycle of an Active Record object that  allow you to trigger logic before or after an alteration of the object  state. This can be used to make sure that associated and dependent  objects are deleted when destroy is called (by overwriting  before_destroy) or to massage attribu








Read more