mhenrixon | Replacing js.erb with turbo

Say you have the following `create.js.erb` file:

lang-js
document.getElementById('new_todo').reset();
$('#wo_todos').prepend("<%= j render("form_todo", work_order: @work_order, todo: @todo) %>");
$('.flash').html("<%= j render("shared/flash", flash:) %>");
$('td#total_price').text("<%= j number_to_currency(@work_order.todos.sum(:price)) %>");

You can simply replace that with something as simple as:

lang-erb
<%= turbo_stream.prepend "wo_todos" do %>
  <%= render partial: "form_todo", locals: { work_order: @work_order, todo: @todo } %>
<% end %>

<%= turbo_stream.update "flash" do %>
  <%= render partial: "shared/flash", locals: { flash: flash } %>
<% end %>

<%= turbo_stream.update "total_price" do %>
  <%= number_to_currency(@work_order.todos.sum(:price)) %>
<% end %>

<%= turbo_stream.update "wo_new_todo" do %>
  <%= render "todos/form_todo", work_order: @work_order, todo: Todo.new %>
<% end %>

See how simple it is? Do you also see how much more structured the code looks?

Replacing js.erb with turbo_stream.erb

Comments