Question

I have:

1. controller/reports_controller.rb

2. views/reports/index.html.erb

3. assets/reports.js

I have an image in index.html.erb:

<div class="main_mark">
   <img src="/assets/welcome_main.png" alt="main" class="main_mark_image" />
</div>

I want to print an message to the screen (alert message) when the user presses the image. so I want to write a function in reports.js that print the message.

reports.js:

$(document).ready(function() {
    $(".main_mark_image").click(function () {
        alert("alon");
    });
});

but I think I have to relate between the java script the the html.

any help appreciated!

Answer 1

When using an external script you need to tell your HTML file:

<script src="assets/reports.js"></script>

The above assumes that your ‘assets’ folder is in the same folder as your index. You also need to include the jQuery library. It’s available for download or you can use Google’s:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

Or, for jQuery UI:

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>

Hope this helps.