jQuery plugin Rails not loading

Question

I've had this problem before and I spent two full weekends trying to figure out and understand the issue. The same problem continues to arise. Hopefully, I can identify what is exactly going on in this rails app.

Getting the jQuery plugin pageslide to work with my rails app.

In app/vendor/assets/javascripts is the file jquery.pageslide.js. So, I modify my application.js manifest accordingly-

//= require jquery
//= require jquery-ui
//= require jquery_ujs
//= require jquery.ui.datepicker
//= require raphael.min
//= require justgage
//= require jquery.purr
//= require best_in_place
//= require lightbox
//= require jquery.cookie
//= require jquery.joyride-2.0.3
//= require jquery.pageslide
//= require modernizr.mq
//= require_tree .

I do the same thing for the jquery.pageslide.css in app/vendor/assets/stylesheets. The application.css manifest

 *= require jquery.ui.datepicker
 *= require_self
 *= require bootstrap
 *= require front
 *= require lists
 *= require tasks
 *= require lightbox
 *= require joyride-2.0.3
 *= require jquery.pageslide
 */

Now using the plugin to slide out a modal in one of my views-

views/lists/show.html.erb-

<a href="#modal123" class="second_thing">Link text</a>
<div id="modal123" style="display:none">
    <h2>Modal</h2>
    <p>And all the stuff.</p>
    <a href="javascript:$.pageslide.close()">Close</a>
</div>

javascripts/lists.js.coffee-

$ ->
  $("a.second_thing").pageslide({ direction: "left", modal: true });

My initital checklist-

-No warnings or errors from the console. -The css and js pageslide files are found in the pages' source. - Making sure the DOM/jQuery is loaded before calling pageslide in javscripts/lists.js.coffee -The order of my manifest file doesn't seem to indicate that the lists.js.coffee is being executed before pageslide.js is loaded

It looks like I'm missing some additional checks to make sure this works?

Other notes- In development env, other jQuery plugin working (joyride but calling it in show.html.erb page with script tags), I have this line config.assets.initialize_on_precompile = false to appease devise in application.rb.

I'm stumped, what else should I be checking for?

I have no enough info about js and jquery, but it seems to first line in coffee file should be removed, could you try it? — ekremkaraca
– ekremkaraca, Commented Jul 14, 2013 at 22:05
That bit is needed to delay the code until the DOM has loaded. Without it the code would be executed before the full html loads. — computer_smile
– computer_smile, Commented Jul 14, 2013 at 22:14
I've examined your coffee and sample in pageslide plugin page. Almost copy-paste but except compiled script. When I checked your code from coffeescript.org page, produced script is different from sample script in original one. I advise to check your code and see difference between original one and yours. — ekremkaraca
– ekremkaraca, Commented Jul 14, 2013 at 22:31
I will check but I don't believe that is the issue as I have ran it exactly the same as the example in plain javascript <script> $(document).ready(function() { $(".second_thing").pageslide({ direction: "left", modal: true }); }); </script> on the show.html.erb page as well to no avail. — computer_smile
– computer_smile, Commented Jul 14, 2013 at 22:43
Have you inspected the console in Chrome / Firefox? This might show up some javascript errors. I had a similar problem with a site which ended up being caused by order of the javascript requires. — muttonlamb
– muttonlamb, Commented Jul 14, 2013 at 23:49

computer_smile · Accepted Answer · 2013-07-15 00:27:20Z

2

Ok I got it working thanks to @muttonlamb's comment and rereading the asset pipeline section on rails guides.

I added this line in my show.html.erb file because pageslide requires the source file to be included within the body tag and the way I had it initially it was only being loaded in the head.

<%= javascript_include_tag "jquery.pageslide" %>

NOTE: I also explicitly added jquery.pageslide under app/assets/javascripts to make the above reference.

This doesn't seem the most performance friendly so I will gladly mark a better answer to achieve the above.

answered Jul 15, 2013 at 0:27

computer_smile

2,2872 gold badges27 silver badges46 bronze badges

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

Collectives™ on Stack Overflow

jQuery plugin Rails not loading

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related