形式与ajax要么只可用一次或不更新，直到刷新

我想使用JavaScript来更新在rails中构建的wiki应用上的协作者表，将它们从现有用户的另一个表添加到同一页上。最初，当我添加协作者时，协作者创建操作只会运行一次，并且我必须刷新页面才能添加另一个。我尝试在我的javascript中添加.ajax（cache：false），现在我可以添加多个协作者而无需刷新，但他们不会显示在协作者表上，或者在刷新页面之前从用户列表中消失。形式与ajax要么只可用一次或不更新，直到刷新

这里是我的javascript：

<% if @collaborator.valid? %> 
    $('.js-collaborators').html("<%= escape_javascript(render partial: 'collaborators/collaborator') %>").ajax(cache: false); 
    $('.new-collaborator').html("<%= escape_javascript(render partial: 'collaborators/users', locals: { wiki: @wiki }) %>").ajax(cache: false); 
<% else %> 
    $('.new-collaborator').html("<%= escape_javascript(render partial: 'collaborators/users', locals: { wiki: @wiki }) %>").ajax(cache: false); 
<% end %>`

合作者部分：

<table class="table table-striped" style="width:75%"> 
    <tr> 
    </tr> 
    <% @wiki.collaborators.each do |collaborator| %> 
    <tr> 
     <% user = User.find(collaborator.user_id) %> 
     <td><%= user.user_name %></td> 
     <td> 
     <%= link_to 'Remove', [@wiki, collaborator], method: :delete, class: 'btn btn-xs btn-danger', remote: true %> 
     </td> 
    </tr> 
    <% end %> 
</table>

用户部分：

<table class="table table-striped" style="width:75%"> 
    <% User.all.each do |user| %> 
    <% if [email protected](:user_id).include?(user.id) %> 
    <%= form_for [@wiki, @wiki.collaborators.build], remote: true do |f| %> 
     <tr> 
     <td><%= user.user_name %></td> 
     <td> 
      <%= f.hidden_field :user_id, :value => user.id %> 
      <%= f.submit 'Add', class: 'btn btn-xs btn-success', method: :create %> 
     <% end %> 
     </td> 
     </tr> 
    <% end %> 
    <% end %> 
</table>

的wiki显示网页中的相关部分：

<div class="js-collaborators"> 
    <%= render partial: 'collaborators/collaborator', locals: {wiki: @wiki} %> 
</div> 
<button type="button" class="btn btn-sm btn-info" data-toggle="collapse" data-target="#add-collaborators">Add Collaborators</button> 
<div id="add-collaborators" class="new-collaborator collapse" > 
    <%= render partial: 'collaborators/users', locals: {wiki: @wiki} %> 
</div>

我猜测将缓存设置为false并不是修复需要刷新页面以添加其他协作者的初始问题的理想方法，但我不确定还有什么可以尝试的。我对rails和javascript都很陌生。谢谢！

编辑：我改变了我的JavaScript使用.reset（），而不是.ajax（缓存：假）。与此同时，我的协作者列表正确更新，但用户列表没有。下面是更新后的javascript：

<% if @collaborator.valid? %> 
    $('.js-collaborators').html("<%= escape_javascript(render partial: 'collaborators/collaborator') %>").reset(); 
    $('.new-collaborator').html("<%= escape_javascript(render partial: 'collaborators/users') %>").reset(); 
<% else %> 
    $('.new-collaborator').html("<%= escape_javascript(render partial: 'collaborators/users') %>").reset(); 
<% end %>

来源

2014-12-19 Clare Strong

难读的代码，但是你是如何烧制的AJAX事件？用户是否按下按钮，或者什么时候改变了？从AJAX请求获取信息后，您是否尝试重置表单（form.reset（））？ – David 2014-12-19 02:31:42

当用户单击添加按钮时会触发该事件。我只是尝试将.reset（）添加到我的javascript中，这让我有一部分的方式。现在当我点击添加时，新的协作者出现在协作者列表中，但他们不会从用户列表中删除。我会继续玩。谢谢！ – 2014-12-19 03:33:06

我能够通过在用户表中增加一个ID到该行，并具有将用户作为一个合作者，而不是当我的JavaScript隐藏行来解决这个重新呈现部分。

新的JavaScript：

<% if @collaborator.valid? %> 
    $('#user-' +<%= @collaborator.user_id %>).hide(); 
    $('.js-collaborators').html("<%= escape_javascript(render partial: 'collaborators/collaborator') %>").reset(); 
<% else %> 
    $('.new-collaborator').html("<%= escape_javascript(render partial: 'collaborators/users') %>").reset(); 
<% end %>

新用户表：

<table class="table table-striped" style="width:75%"> 
    <% User.all.each do |user| %> 
    <% if [email protected](:user_id).include?(user.id) %> 
    <%= form_for [@wiki, @wiki.collaborators.build], remote: true do |f| %> 
     <tr id='user-<%=user.id%>' > 
     <td><%= user.user_name %></td> 
     <td> 
      <%= f.hidden_field :user_id, :value => user.id %> 
      <%= f.submit 'Add', class: 'btn btn-xs btn-success', method: :create %> 
     <% end %> 
     </td> 
     </tr> 
    <% end %> 
    <% end %> 
</table>

来源

2014-12-19 14:32:33

形式与ajax要么只可用一次或不更新，直到刷新

回答

相关问题