Rails TIP: Use dom_id to Generate Ids in HTML
When working with Rails, there’s always a better way to do something.
It’s one of those tools that I wish I discovered years ago.
If you’ve written code like below, dom_id may help you in the future.
<% @posts.each do |post| %> <p id="index_post_<%= post.id %>"></p> <% end %>
index_post_<%= post.id %> every time.
I have come across code like this in a js.erb template.
var post = document.querySelector("#index_post_<%= @post.id %>")
And in the background job or service worker, you will also have to remember this format if you plan on using something like cable ready to update the dom.
Luckily, dom_id provided a simple way to clean up all that code and make everything DRYer.
How do you use dom_id?
As with a lot of view helpers in Rails, using it is straightforward.
Using it in a view
Let’s imagine we have a Post model.
The dom_id methods take one argument and one optional argument for a prefix.
# without prefix dom_id(Post.find(2)) # => "post_2” dom_id(Post.new) # => "new_post” # with prefix dom_id(post.find(2)) #=> “post_2” dom_id(post.find(2), :custom) #=> “custom_post_2”
Using it from a background job or model
Since dom_id is baked right into Rails, you can call it from anywhere using ActionView.
app/models/post.rb def dom_id ActionView::RecordIdentifier.dom_id(self) end