Javascript code not working in Ruby on Rails

Question

I was trying to do my front-end with this Codepen Template but when i'm trying to click on the signup button, it's not changing to signup form for which the code is in the index.js file, i've included hte index.js file in the login.html.erb but when i'm running the rails server the transition isn't working. My Rails Project, Codepen Template Here is the javascript code in index.js

document.querySelector('.img__btn').addEventListener('click', function() {
document.querySelector('.cont').classList.toggle('s--signup');  });

Vishal · Accepted Answer · 2017-07-03 06:32:40Z

2

Try changing the path of index.js Add this line in app.html for including index js file .

<%= javascript_include_tag "index" %>

answered Jul 3, 2017 at 6:32

Vishal

7,3716 gold badges34 silver badges65 bronze badges

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

3 Comments

Aashish Kumar Over a year ago

I've already added index.js in the asstes/javascripts folder which is the default folder for Ruby on Rails but it's still not working.

Vishal Over a year ago

@AashishKumar did u check the view source of page ?

Aashish Kumar Over a year ago

no i haven't but the above answer by Sebastian worked, i have to include the js code in DOMContentLoaded, it worked, but i don't know about DOMContentLoaded, can you please tell me what it is??

Sebastián Palma · Accepted Answer · 2017-07-03 06:30:08Z

1

Wrap your current JS code in app/assets/javascripts/application.js within a DOMContentLoadListener event listener:

document.addEventListener('DOMContentLoaded', function() {
  document.querySelector('.img__btn').addEventListener('click', function() {
    document.querySelector('.cont').classList.toggle('s--signup');
  });
});

answered Jul 3, 2017 at 6:30

Sebastián Palma

33.6k6 gold badges45 silver badges65 bronze badges

4 Comments

Sebastián Palma Over a year ago

As you have two times the same piece of code, it can be done in the application.js or in the index.js file. You then might consider removing the repeated one.

Aashish Kumar Over a year ago

Do RoR add the application.js code automatically or i have to add it manually with javascript_include_tag??

Aashish Kumar Over a year ago

Also thanks @Sebastion, you again saved the day, it worked but can you please tell what is it exactly??

Sebastián Palma Over a year ago

The js code in the application.js file is executed "automatically" by Rails, it's added in your application erb file and this also adds all what you set by using //=, the code in it appears at the bottom of the compiled file. And about the DOMContentLoaded you can see here that's fired when the HTML has been totally loaded, so, this guarantees you all the needed file for your piece of code will be available @AashishKumar.

Collectives™ on Stack Overflow

Javascript code not working in Ruby on Rails

2 Answers 2

3 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related