dips
dips

Reputation: 380

how to use any javascript code in rails app?

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?

Upvotes: 0

Views: 169

Answers (3)

dips
dips

Reputation: 380

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.

Upvotes: 0

jaspreet21anand
jaspreet21anand

Reputation: 779

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

Upvotes: 1

WKx
WKx

Reputation: 411

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

Upvotes: 1

Related Questions