CODEWITHSUNDEEP
jqueryruby-on-railsruby-on-rails-4
Kamal G'ool
Kamal G'ool

Reputation: 171

Adding jQuery plugins to my rails 4 apps

It seems to be that I'm missing something, I am not being able to add jQuery plugins, lets say Mask plugin, I get errors trying to $('form').mask() with error c.off is not a function, I am willing to bet I am not being able to install the js files in the right place, I am using rails 4, what am I missing ?

also when I include them remotely in the 

# application.erb
<%= javascript_include_tag  https://cdn.jsdelivr.net/jquery.mask/1.13.9/jquery.mask.min.js" %>

I still get errors, not only with that specific plugin.

UPDATE: I installed jquery.mask.min.js to vendor/assets/javascripts

enter image description here

I //= require jquery.mask.min.js in application.js

//= require jquery
//= require jquery_ujs
//= require jquery.mask.min.js

I try to $('input').mask('99-999-99');

I get error saying mask is not a function

enter image description here

Upvotes: 0

Views: 914

Answers (4)

Kamal G&#39;ool
Kamal G&#39;ool

Reputation: 171

Okay, my bad, The problem was because of both requirng including jquery

once //= require at the application.js

and once <%= javascript_include_tag "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.4.min.js" %>

from the application layout.

Thanks.

Upvotes: 0

Frederik Spang
Frederik Spang

Reputation: 3454

What it looks like you're trying to do, is add the -tag to your page. In which case what you'd want to do, is add 

<%= javascript_include_tag "https://cdn.jsdelivr.net/jquery.mask/1.13.9/jquery.mask.min.js" %>

to your layout file, and not in your application.js-file.
Another way is to download the file, and include it in your application.js, by the //=require .....-method.

Upvotes: 0

volx757
volx757

Reputation: 163

Since you've specified jquery and rails, how about the jquery-rails gem:

https://github.com/rails/jquery-rails

which comes with any rails-jquery integration you might need built in. It requires a bundle install and the following two lines to be added to application.js:

//= require jquery
//= require jquery_ujs

Upvotes: 0

bkunzi01
bkunzi01

Reputation: 4561

You need to download the js file for the plugin and add it to your vendor/assets/javascript folder. You then must require it in your app/assets/javascript/application.js file as:

//= require filename

If you put it in a subfolder for example named "jquery_plugins" in your vendors/assets/javascript folder you will need to require it in your assets/javascript/application.js file as follows:

//=require subfoldername/filename

Note: Make sure to leave off the js extension AND REQUIRE IT AFTER THE REQUIRE Jquery and Jquery-ui statements. If it is a minified file you must add the .min to the require statement in your application.js file but not the '.js' extension. Ex: 

//=require subfoldername/filename.min

Once done, restart your server and check again.

Upvotes: 1

Related Questions