I'm working on a Gem that adds extra functionality to ActiveRecords. During installation, someone has to add the following to their form's erb file to get extra form elements provided by my gem:
<%= render "forms/my_gem", form: f %>
What is the best way to handle adding javascript inside my view file? I hate to have this javascript be used on every page, so I was wondering if the best approach is to add inline javascript. If you know of a gem that does this, can you please share.
Related
I'm using the react-rails gem to integrate react with rails, and I'm conflicted on how I should organize my code.
Is it preferable that I have my core html in the html.erb files or in the jsx files? Currently, I basically made everything a component. All I do in my html.erb files is using the react_component helper to call those components. For example, I would have a ProfileShow.js.jsx file for my profile page and a EditPost.js.jsx for my edit post page.
What is your suggestion?
I prefer move my react-component's code to js-files. And link them using react_component helper method. It isn't good practice to write your js-code in views.
There are multiple ways to do this.
One of the best solutions I seen so far is to write your react jsx components in an app/assets/javascripts/components folder.
Setup a react gem like https://github.com/shakacode/react_on_rails
that would help with passing on data as props to the view layer as these would be accessible outside react.
I hope this helps.
Cheers.
I am using Rails with AngularJS and I would like to use rails helper and erb-style if statement in an Angular template.
I am displaying a delete button and want to make sure only the owner can see this button.
In a normal erb file, I would write:
<% if #article.id == current_user.id %>
<button>Delete</button>
<% end %>
I attempted to add erb extension to my template files, but I could not use embedded ruby syntax, nor the helper current_user.
Another approach I took was adding ng-show='owner' to the button, and define owner function in the Angular controller to determine if the current user is the owner. But this did not work as I don't have access to current_user.
Any suggestions? If there is a more Angular way to do this, I would also like to know.
I think one of the hardest things with AngularJS is switching to a mindset of "data retrieved from the server" not "data available directly in the server".
That is, you need to abandon the idea that you can use any rails-like conventions in your template (same goes for Django or PHP or any other framework).
Instead, think of how you can add an API to your Rails code that returns the data in question in a clean JSON format. Then write an angular service that calls it, say ArticleService.get(id), and then your angular template will be straightforward.
I've got a simple rails gem (created using bundler) and I'd like to extend it by adding some CSS and javascript functionality. However, I'm unsure how to go about this and where to add the files. In particular, I need need more information on how it all fits together with the asset pipeline once it gets included in another project.
Can anyone give me the lowdown on how this works and either provide some simple examples or link to a tutorial? Literally 1 css and 1 js file is all I'm looking to include. Thanks.
You could write the gem as an engine. This allows you to have an app folder in the gem just as any Rails application would have. You can add models, views, controllers, assets etc.
Once you have it set up it's quite intuitive and it's a familiar way to create a gem if you're used to creating Rails apps.
This should get you started:
http://coding.smashingmagazine.com/2011/06/23/a-guide-to-starting-your-own-rails-engine-gem/
I am trying to make common templates that used both by Rails and the client side, ie in coffescript.
I use hogan_assets and haml_assets to export templates to JS. However I can't find a way to use HAML and Mustache to render server-side views.
Partial solution is described here, but it doesn't work with view helpers, ie, "render partial" doesn't work.
For some unknown reason chaining of handlers, such as .mustache.haml, doesn't work, and I can't find neither good info on Rails template handler nor an example on how to build "chainable" handler.
I've been experimenting with something like smt_rails lately, but I have yet to find a silver bullet.
In the release notes for Rails 3.0 beta it says:
"Unobtrusive JavaScript helpers with drivers for Prototype, jQuery"
So how do I setup Rails 3 to use jQuery then? It still loads all the Prototype libraries by default.
I took this to mean that Rails 3 has built in functionality similar to the jRails plugin, but maybe I'm misunderstanding :)
Also, as a bonus question, if I am using Prototype is there a way to get Rails to load the minified versions, and even better a single concatenated JS file to cut down on http requests?
Thanks.
When you create a Rails 3 app, just pass along the -J param as well:
$ rails app_name -J
This will skip over including the Prototype libraries. Now, all you need to do is drop the latest jquery.js file into the public/javascripts directory. Once you do that, you'll also need the jQuery version of the rails.js file. You can get that here:
http://github.com/rails/jquery-ujs/blob/master/src/rails.js
EDIT: You need to include these files in the top of your layouts to gain the functionality. You can do this by:
<%= javascript_include_tag "jquery", "rails" %>
Hope this helps!
Unobtrusive JS doesn't refer to the PrototypeHelper methods, but to remote forms and links and the like. The concept is that you include :remote => true in your form_for or whatever helper methods support it, and then a driver called rails.js will look for those remotes and intercept the submit or click events and send them via xhr.
To use jquery you'll just need to replace the prototype ujs driver (which ships with rails) with the jquery ujs driver, that was extracted into its own repo shortly before the rails 3 beta release. You can find it here.
Check out Google Closure
It can turn multiple javascript files into a single compressed js file. It can even figure out which parts of the library you aren't using and remove them as well.
I don't know about Rails 3, but I'll try to answer bonus question.
You can put whatever you want in public/javascript directory. By default it will load files: prototype.js, effects.js, dragdrop.js and controls.js (read more). If you want to compress all js files and send it in one file, you can use this plugin.
Of course it won't work for dynamicaly generated js files.
I'm also working on that with trying to convert my old ajax with rails 3.
From what I can tell, they moved to a structure that adds a data-remote=true and when you add :remote => true to something like link_to which is supposed to replace link_to_remote in rails 3, so there are no more onclick methods that calls Ajax methods.
So, how does Ajax work in Rails 3, then? Well, you are supposed to have javascript methods that watch for when you click links that have a property of data-remote=true and does something with it, but don't actually include them in Rails (from what I can tell), it's library agnostic since you can write these methods to watch for clicks in prototype, jquery, write them yourself, or whatever else is out there.
I did find some javascript on github to get started that will watch for these events:
In prototype
In jQuery
I think in order to actually load jquery instead of prototype, you're going to have to just download it to public/javascripts and manually specify jquery, use javascript_include_tag :all, or override javascript_include_tag (not recommended)