how to use any javascript code in rails app?

Question

I am using rails4 and i want to include zooming feature in my app. I am follwing first example of this- http://zoomsl.sergeland.ru/example/ I put the .js file in javascripts folder and wrote the function to call the method from the js file in the script code below the page but it say "undefined method" in console. I checked in the source that the file is there in the list of all the js files which are included in the app, and I found it there. Please help.. Am I missing something?

Edit: I have included the js file in assets which is downloaded from the above link. In template

 <Img  class = "my-foto"  src = "<%= p.asset1.url(:small)%>"   Data-large = "<%= p.asset1.url(:large)%>"  title = "Photos" >

<Script> 
$(document).ready(function(){

  $ ( ".my-foto" ). imagezoomsl ({  <-----Here is the error "Undefined is not a fuction

     zoomrange :  [ 3 ,  3 ] 
  }); 
});    
</ script>

Another try:I downloaded the demo1.zip. In that demo if zoomsl-3.0.min file is not included it displays an msg-Please include zoomsl-3.0.min file. I copied the code in my app and found that its displaying the same message, even though I have included it and checked it also by console.log. I cant get it, Why its happening like this?

Take a look this answer stackoverflow.com/a/19834224/1297435 — rails_id
– rails_id, Commented Mar 12, 2015 at 8:22
I tried the things described in stackoverflow.com/a/19834224/1297435, but t=still its showing the same error. — dips
– dips, Commented Mar 12, 2015 at 8:33
I tried it on my system. It works pretty fine. Initially it was giving some encoding error, so saved it in UTF-8 encoding and all was well. You must check your spellings in your code I guess. — jaspreet21anand
– jaspreet21anand, Commented Mar 13, 2015 at 6:35
I too tried it on other rails app, and it working fine.... but in my this app its not working — dips
– dips, Commented Mar 13, 2015 at 6:52

WKx · Accepted Answer · 2015-03-12 06:50:45Z

1

Check if the code in the js file is executing by adding a console log at the end of it (make sure it is included by your application.js) Also make sure to execute the call from your page after the document load event is thrown, or the script tag could try to call before the js function is defined.

If you 're using jquery:

$( document ).ready(function(){
  // call your js function here
})

redefined window.onload for pure js

answered Mar 12, 2015 at 6:50

WKx

4115 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

dips Over a year ago

I checked by adding the console.log("xyz") at the end of the js file, and it printing the output "xyz" in console, so its executing. And after refreshing the page, it first shows the output "xyz" then its showing the message-"Uncaught TypeError: undefined is not a function" on the line "$ ( ".my-foto" ). imagezoomsl ({"

dips Over a year ago

I downloaded the demo1.zip. In that demo if zoomsl-3.0.min file is not included it displays an msg-Please include zoomsl-3.0.min file. In my app , its displaying the same message, even though I have included it and checked it also by console.log. I cant get it, Why its happening like this?

jaspreet21anand · Accepted Answer · 2015-03-13 03:27:27Z

1

You ll have to include the javascript file on the page where u are using it, anywhere before the script tag.

Use

<℅= javascript_include_tag 'filename' %>

Also add this file to assets.rb file for precompilation

OR

Simply go to application.js and check if it is using require tree or not. It should do if you want the file to be included automatically on ur page

answered Mar 13, 2015 at 3:27

jaspreet21anand

7791 gold badge6 silver badges8 bronze badges

4 Comments

jaspreet21anand Over a year ago

Just to double check, you have added your file in javascript folder under the assets folder in app folder.

dips Over a year ago

I have included the js file inside javascript folder and in application.js, require_tree . is also there. I also tried by including the javascript_include_tag. Its giving me the same error :(

jaspreet21anand Over a year ago

try to trace back the line number it is giving error on. and let me know the exact code of the line.. copy paste it here

dips Over a year ago

I have edited the code and pointed out the exact line on which its showing error.

dips · Accepted Answer · 2015-03-16 17:27:20Z

0

I included a script tag for jquery while implementing bootstrap into my app. That was creating problem, as I removed that jquery line, zoom is working perfectly alright.

edited Mar 16, 2015 at 17:27

answered Mar 16, 2015 at 12:13

dips

3801 gold badge6 silver badges17 bronze badges

2 Comments

jaspreet21anand Over a year ago

Thats great. I think you might have got a lot of other stuff too while figuring out this problem :)

dips Over a year ago

@jaspreet21anand yes!! Thanks to all of you guys. All of this cleared many things :)

Collectives™ on Stack Overflow

how to use any javascript code in rails app?

3 Answers 3

2 Comments

4 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

4 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related