Rails 5.1: refresh partial within partial with AJAX

Question

I have partial _navigation.html.erb where there is this piece of code:

<div class="dropdown profile-element">
  <a data-toggle="dropdown" class="dropdown-toggle" href="#">
    <span class="clear">
      <span class="block m-t-xs">
        <div id="userprofile">
          <%= render 'users/user', user: current_user %>
        <b class="caret"></b>
      </div>
      </span>
    </span>
  </a>
  <ul class="dropdown-menu animated fadeInRight m-t-xs">
    <li><%= link_to t('.profile'), edit_user_path(current_user), remote: true %></li>
    <li class="divider"></li>
    <li><%= link_to t('.logout'), logout_path %></li>
  </ul>
</div>

I render User name in this _user.html.erb partial:

<strong class="font-bold"><%= user.name %></strong>

When I login, I see my current_user name in navigation partial as expected. However when I try to Update my User name (modal window), I don't see my current_user value changes in _user.html.erb partial.

My users_controller.rb Update action looks like this:

  def update
    @user.update(user_params)
    respond_to do |format|
      format.json { update_flash }
      format.js { update_flash }
    end
  end

  private

  def user_params
    params.require(:user).permit(:name, :email, :password, :password_confirmation,
                                 :locale, :menu_role, :psw_change,
                                 {company_ids: []}, {user_group_ids: []})
  end

  def correct_user
    users = User.where(id: helpers.users_all)
    @user = User.find(params[:id])
    redirect_to(errors_path) unless users.include?(@user)
  end

  def update_flash
    flash[:notice] = "#{@user.name.unicode_normalize(:nfkd)
                                  .encode('ASCII', replace: '')} ", t(:updated)
  end

update.js.erb looks like this:

$('#dialog').modal('toggle');
$('#userprofile %>').replaceWith('<%= j render (@user) %>')

I see clearly in my console Update action is done, my files are rendered, no errors:

  Rendering users/update.js.erb
  Rendered users/_user.html.erb (0.6ms)
  Rendered users/update.js.erb (8.5ms)
Completed 200 OK in 126ms (Views: 41.1ms | ActiveRecord: 16.0ms)

What am I doing wrong here, please? It would be nice to be able to show updated current_user name in profile. I'll be happy for any hint, where should I be looking at. Thank you.

Answer 1

In update.js.erb , you have a typo. You should delete the %> . Try this:

$('#userprofile').replaceWith('<%= j render (@user) %>')

Also, instead of replacing the entire #userprofile node, you may want to change the html inside of it instead:

$('#userprofile').html('<%= j render (@user) %>')