partial rendered but not shown

Question

Hoi,

I tried (and succeeded :-) to build a rails page where I can update objects by drag 'n drop. I show cards in a table and if they are dropped into a column an attribute is updated. So far so good, but unfortunately the update is not reflected in the card. I have to reload the whole site to see it (and yes, I use <%= ... :-) In the log I see, that the partial is rendered:

Started PUT "/cards/6" for 127.0.0.1 at 2013-03-21 16:55:42 +0100
Processing by CardsController#update as JS
Parameters: {"utf8"=>"✓", "authenticity_token"=>"B+xkdpwcIcslidgHQPh+I1n+Qh/MxltM=", "card"=>{"user_id"=>"2", "state_id"=>"1"}, "id"=>"6"}
Card Load (0.1ms)  SELECT "cards".* FROM "cards" WHERE "cards"."id" = ? LIMIT 1  [["id", "6"]]
(0.1ms)  begin transaction
(0.2ms)  UPDATE "cards" SET "user_id" = 2, "updated_at" = '2013-03-21 15:55:42.630330' WHERE "cards"."id" = 6
(3.2ms)  commit transaction
State Load (0.1ms)  SELECT "states".* FROM "states" WHERE "states"."id" = ? LIMIT 1  [["id", 1]]
Rendered cards/_card.html.erb (2.8ms)
Completed 200 OK in 9ms (Views: 3.5ms | ActiveRecord: 3.8ms)

But in the Browser the user_id is still 3. So I tried to also show a notice:

format.js {render @card, notice: "nanu"}

But no success, the notice is not shown too.

My partial looks like this:

<%= form_for(@card, remote: true) do |f| %>
  <div id="card_<%= @card.id %>" class="card_mini">
    <h3><%= link_to @card.titel, edit_card_path(@card) %></h3>
    <p><%= @card.beschreibung %></p>
    <%= @card.user_id %> <!-- just to control the rendering -->
    <%= f.text_field :user_id, type: "hidden" %>
    <%= f.text_field :state_id, type: "hidden" %>
    <div class="status"><%= @card.state_id ? State.find(@card.state_id).status : "--" %></div >
    <%= link_to 'Destroy', @card, method: :delete, data: { confirm: 'Are you sure?' }, :class => "aktion" %>
  </div>
<% end %>

Do you have any hints for me? Thanks, S.

I render the partial through the Controller - just use js for the "click" on 'submit'. I thought rails takes care of the asynchronous calls? — McSvenster, Mar 21 '13 at 18:11
It does. But doesn't changes your DOM. I've just added example in the answer. — ck3g, Mar 21 '13 at 19:04

ck3g · Accepted Answer · 2013-03-22T07:45:11.173

0

Judging by comments you have to update DOM in your update.js.erb. Smth like:

$("#<%= dom_id(@card) %>").append("<%=j render 'card/card', card: @card %>");

edited Mar 22 '13 at 07:45

answered Mar 21 '13 at 19:03

ck3g

5,829
3
32
52

This does not work - update.js.erb seems not to be "fired up". I tried to show a simple alert("Hallo Welt"); But thanks you - I'll look further in that direction. – McSvenster Mar 22 '13 at 06:29
I am comming closer... First mistake I made in the controller: I put a render @card in the Format.js line... – McSvenster Mar 22 '13 at 06:54
Oh I'm sorry it was late in the evening and I've made some mistakes. I've fixed them. – ck3g Mar 22 '13 at 07:45
nothing to be sorry for - in the opposite, your comment was very helpful! – McSvenster Mar 22 '13 at 07:48

score 0 · Answer 2 · answered Mar 22 '13 at 08:02

Thank you, ck3g, for your help! Now it works. Two things I had to learn:

Rails takes care for the ajax requests but not for the update of the DOM. That's where the xxx.js.erb enteres the stage.
NEVER put a rendering request after format.js

So, the correct call in the controller is:

respond_to do |format|
  format.html { render action: "whatever you want, or redirect or..." }
  format.js
end

Then rails will render the action.js.erb (in my case update.js.erb). The code I needed in the update.js.erb was:

$("#card_<%= @card.id %>").html('<%=j render @card %>');

Now in my log I find the rendering of the partial and the rendering of the update.js.erb.

partial rendered but not shown

2 Answers2