【问题标题】:Rails 5: refresh partial in another partial with AJAX update actionRails 5:使用 AJAX 更新操作在另一个部分中刷新部分
【发布时间】:2017-03-06 18:37:04
【问题描述】:

我有 /views/layouts/_navigation.html.erb,其中生成了部分用户配置文件:

<nav class="navbar-default navbar-static-side" role="navigation">
    <div class="sidebar-collapse">
        <ul class="nav metismenu" id="side-menu">
<!-- Here we render user profile -->
      <div id='userprofile'>
        <%= render 'layouts/userprofile' %>
      </div>
<!-- Here we render menu -->
        <% cache "#{I18n.locale}_menu" do %>
          <%= render 'layouts/menu' %>
        <% end %>
        </ul>
    </div>
</nav>
<!-- Here we render modal window dialog -->
<%= render 'users/dialog' %>

/views/layouts/_userprofile.html.erb 我有这个:

<div class="dropdown profile-element">
    <span>
      <img alt="image" class="img-circle" src="<%= image_url 'profile_small.jpg' %>"/>
    </span>
      <a data-toggle="dropdown" class="dropdown-toggle" href="#">
        <span class="clear">
          <span class="block m-t-xs">
            <strong class="font-bold"><%= current_user.name %></strong><b class="caret"></b>
          </span>
        </span>
      </a>
      <ul class="dropdown-menu animated fadeInRight m-t-xs">
        <li><a href=""><%= t('.sellerdash') %></a></li>
        <li><a href=""><%= t('.buyerdash') %></a></li>
        <li><%= link_to t('.profile'), current_user %></li>
        <li><%= link_to t('.settings'), edit_user_path(current_user), remote: true %></li>
        <li class="divider"></li>
        <li><%= link_to t('.logout'), logout_path %></li>
      </ul>
    </div>

单击设置时,会打开模式窗口并可以编辑用户设置。有 /views/users/update.js.erb 做同样的工作,但在用户表中:

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

当用户设置更新时,我想刷新 _userprofile.html.erb 部分以显示新信息,例如用户名。

到目前为止,我认为我需要将此行添加到 /views/users/update.js.erb

$('#userprofile').html('<%= j render 'layouts/userprofile', locals: {user: @user} %>')

但是它不起作用。

请问我该如何解决这个问题?谢谢!

更新

我的 /controllers/users_controller.rb 中的更新操作如下所示:

def update
    respond_to do |format|
        if @user.update(user_params)
          format.json { head :no_content }
          format.js
        else
          format.json { render json: @user.errors.full_messages,
                                     status: :unprocessable_entity }
        end
      end
  end

我发现userprofile.html.erb 仅在连续第二次试用后才会刷新。基本上它不会第一次刷新,在第二轮它刷新必须在第一轮渲染的值。一些奇怪的行为。 有人知道我的部分内容是怎么回事吗?

【问题讨论】:

    标签: javascript jquery ruby-on-rails ajax


    【解决方案1】:

    作为第一个措施,我将首先检查请求是否作为 JS 被触发。您可以在控制台中查看

    还要注意在整个 javascript 代码中使用单引号

    $('#userprofile').html("<%= j render 'layouts/userprofile', locals: {user: @user} %>")
    

    注意我添加的双引号

    我也假设你的控制器中有

    respond_to do |format|
      format.js
    end
    

    在这种情况下,不需要传递局部变量,因为局部变量可以直接访问它们

    所以代码变成了

    $('#userprofile').html("<%= j render 'layouts/userprofile' %>")
    

    还要确保在控制台中您没有看到任何错误。 Javascript 请求通常不会使前端崩溃,因此您不会在屏幕上看到错误。

    希望这些帮助

    【讨论】:

    • 谢谢。我在控制台中看到了`Rendered layouts/_userprofile.html.erb (23.9ms)`,但是没有显示新值。我在控制器中有format.js。基本上新值被保存,但不被渲染。难道 Rails 不明白它必须替换 &lt;div id='userprofile'&gt; 中的值吗?
    • 我应该让自己更清楚,您关心的不是“渲染...”,而是例如“由 WelcomeController#index 处理为 HTML”,您会看到它的最后一部分是 HTML,因此请验证你它说的是JS。您也可以发布控制器操作代码吗?
    • 在控制台中我看到Processing by UsersController#update as JS 请参阅上面添加的更新操作的用户控制器代码。
    • 这是我发现的。在第一次更新时,值不会改变,但是当我连续第二次更新时,它会更新为第一次尝试时应该更新的值。我相信这意味着 Rails 知道要更新什么,只是没有以正确的方式更新。
    • 第一次可能会出现某种错误,你用这一行显示错误,它有效吗? (format.json { render json: @user.errors.full_messages, status: :unprocessable_entity })
    猜你喜欢
    • 1970-01-01
    • 2017-05-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-11-24
    • 1970-01-01
    相关资源
    最近更新 更多