Rails 3 project, installed jquery-rails gem, but getting "Ajax is not defined" - ruby-on-rails

I'm a rails newbie trying to follow a howto on how to perform some Ajax calls (after switching to jQuery), but I've run into a problem.
Whenever I trigger the ajax code (new Ajax.Request()), I get "Ajax is not defined" in firebug. Anyone with more skills than me know what's up here?
update:
For anyone else having this problem, the code that was generating the the above code, was a call to remote_function()
What I have done to set things up:
Added "gem 'jquery-rails', '>= 1.0.12'" to my gemfile, and run bundle install
Run rails generate jquery:install
My public/javascripts/ folder thus has the following files:
application.js
jquery.min.js
jquery-ui.min.js
jquery.js
jquery-ui.js
jquery_ujs.js
The scripts included in my HTML look like this:
<script src="/javascripts/jquery.js?1312911234" type="text/javascript"></script>
<script src="/javascripts/jquery-ui.js?1312911234" type="text/javascript"></script>
<script src="/javascripts/jquery_ujs.js?1312911234" type="text/javascript"></script>
<script src="/javascripts/application.js?1312911234" type="text/javascript"></script>

I'd guess that your tutorial uses Prototype as Ajax.Request is for Prototype, you should be using $.ajax with jQuery. And switching to a jQuery based tutorial might be a good idea too.
You say that you're using remote_function but that's Prototype-specific:
Usage
To be able to use these helpers, you must first include the Prototype JavaScript framework in your pages.
Prototype used to be the default JavaScript library for Rails so I suspect that PrototypeHelper is a leftover. You probably want to look at things like the :remote option on link_to and similar for new code.

Related

Hartl Rails tutorial ch. 5 doesn't load bootstrap automatically

At the point in Ch. 5 of the Hartl tutorial where he's showing off CSS/SCSS/Bootstrap styling for the first time (ch. 5.1.2), you're supposed to see the page transformed from an unstyled HTML page to a nifty styled page. But I wasn't seeing the change. It stayed unstyled.
I typed in the listings carefully (and even copied and pasted them from the website, just to be sure, after encountering this problem), tried switching to different gem version numbers (as other advice on similar problems said to do), etc.
Then I decided to insert in my application.html.erb layout the <link> to the Bootstrap CDN, as well as <div class="bootstrap-fluid"> (which I'm glad I learned from FreeCodeCamp) and that fixed the problem:
<head>
...
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
<body>
<div class="container-fluid">
...
</div>
</body>
Apparently I had done nothing wrong otherwise...my guess is that the bootstrap-sass gem (or some other gem) was not supplying this information correctly.
I'm concerned that if I've put this code in my layout, stuff might break later on. Like, it's supposed to work without what I added, right? Any ideas how to make it work the way Hartl wants it to work?
UPDATE: Ugh. Typo! It turns out that I had misnamed custom.css.scss to custom.css.cscc. Well, that'll do it!
The only reason the Bootstrap CDN link helped was that my layout made use of some Bootstrap. When I started adding custom CSS to custom.css.cscc (sic!) I knew the file wasn't even being read. Lesson learned...type even more carefully.

Activeadmin with Tinymce CDN

I'm fairly new to rails. I have a Rails 3.2.13 app running ActiveAdmin. I'm trying to integrate tinyMCE as my editor for the text areas. I want to use the quick install CDN hosted by Cachefly.
I'm able to add the reference to the minified tinymce javascript on the cdn by adding
config.register_javascript 'http://tinymce.cachefly.net/4.0/tinymce.min.js'
that renders the script tag below in my header.
<script src="//tinymce.cachefly.net/4.0/tinymce.min.js"></script>
How can I add the initializer script below to my head in activeadmin on all the pages?
<script>
tinymce.init({selector:'textarea'});
</script>
I'm a Rails noob. It's probably something simple, but I searched everywhere and I can't seem to figure it out.
Any help would be greatly appreciated.
You can simply add a javascript file as well after you add tinymce to the config. So it would look like:
config.register_javascript 'http://tinymce.cachefly.net/4.0/tinymce.min.js'
config.register_javascript 'admin/custom.js'
Where custom.js would be located in:
app/assets/javascripts/admin/custom.js
And the contents would be your desired js code that will execute on all pages:
(function() {
tinymce.init({selector:'textarea'});
})();

Rails pages are linking in non-existent css file when using Stylus

I am trying to use Stylus with a Rails 4 project, but the asset pipeline seems to be naming the compiled CSS wrong and/or linking to the wrong file. If I generate some assets (rails g assets static_pages) the served pages all end up trying to link to a file that doesn't exist:
<link data-turbolinks-track="true" href="/assets/static_pages.css?body=1" media="all" rel="stylesheet" />
I'm using the stylus gem and I've removed the default one for SASS from my Gemfile. I've also tried stylus_rails, but that seems to be deprecated and it didn't change anything anyways. Has anyone else encountered this issue when using stylus with rails?
I'm really at a loss here; any help would be appreciated. Thanks!

Rails: How do I do bundle clear?

I inherited a Rails 3.1 app, served by passenger/nginx.
I thought I had to upgrade from ActiveAdmin 0.4 to 0.5, but
that caused other problems, so I found a workaround and
downgraded to 0.4.0.
Then Ruby started complaining that the formtastic-bootstrap
gem wasn't checked out. Here's the line in the Gemfile:
gem 'formtastic-bootstrap', :git => "git://github.com/cgunther/formtastic-bootstrap.git", :branch => "bootstrap-2"
And there certainly was a f-b gem in the config, but then
someone on stackoverflow said to run
bundle install --deployment
and after I ran that incantation, the site loaded. Except all the
ActiveAdmin CSS is gone. I can make small mods to the file
assets/active_admin.css and they take effect, but the site otherwise
looks like times roman crap.
So I did something bad during one of the above steps -- I normally
run bundle install as root, but the site is owned by 'web'.
And after Ruby complained that it couldn't find formtastic-bootstrap,
I found two of those gems installed in /home/web/.bundler/ruby/
(or something like that), and because Ruby must have been complaining
about them, I deleted them. There wasn't anything else there.
After running another bundle install,
the site would then load, but the CSS wasn't taking effect.
I loaded up the reference site in a different tab, and compared the HTML
I've generated with the reference HTML. The only difference is in the
two lines that load the JS and CSS. In the reference site:
<link href="/assets/active_admin-e1b0dc3ef3753e264638b07b12174adb.css" media="all" rel="stylesheet" type="text/css" />
<script src="/assets/active_admin-385197d3f18a204049d4eb22bc9a033e.js" type="text/javascript"></script>
In mine:
<link href="/assets/active_admin.css" media="all" rel="stylesheet" type="text/css" />
<script src="/assets/active_admin.js" type="text/javascript"></script>
I know the JS and CSS are being loaded, because I see the alert, and other things get
colorized, just not the ActiveAdmin elements. But the DOM inspector shows that the
reference site is pulling all sorts of things out of that CSS file for the body element,
while for my page, it's only pulling generic style rules out of
resource://gre-resources/html.css and a data URI that doesn't need repeating here.
The Error Console is full of the usual jquery and google.maps JS admonitions (it's
a gmap app), but nothing jumps out.
Does this ring a bell for anyone? I gather the reason why I'm seeing untagged
CSS and JS file references is because of that "bundle install --deployment" I
ran, followed by "bundle install --no-deployment" when things got worse. I just
want to set things back to square 1.
So how can I just clear everything? Or better still, is are there a bunch of
magic doodads being cached somewhere?
You could try doing a bundle uninstall
another possibility is to rename the Gemfile.lock and rerunning bundle install, this will force a full re-install.
If you are using version control, such as Git, you could run a diff and see what changes have been made to the code and comparing.

rails 3.2.9 + ember.js 1.0.0-pre.2 keeps giving template not found error, any clue?

Is there a sample Rails backend + ember.js 1.0.0-pre.2 app to refer.
My application is broken after upgrade.
I read about the named handlebars but there seems to be an issue.
If I write in index.html.haml
<script type="text/x-handlebars" data-template-name="application">
<h1>HI</h1>
</script>
Ember.TEMPLATES has a template named application
if I write a file application.handlebars with same content, I get the error Unable to find template 'application'
Is there any path configuration which has to be done which is missing. Please help.
I'm maintaining an up-to-date Rails / ember example you could reference:
https://github.com/dgeb/ember_data_example
Are you using ember-rails to compile your templates? Of course, you'll also need to require your templates in your application.js if you're using the asset pipeline.
Removed handlebars-assets Gem from Gemfile it used to work till 1.0.pre, it was generating handlebars which were not compatible to Ember code. Ember adds all templates to Ember.TEMPLATES, it was adding into HandlebarsTemplates.
Actually handlebars-assets was never needed. Thanks everyone for help.

Resources