Использование пульта: true из .js файла

Question

Это почти идентичный вопрос, который задавали здесь: https://stackoverflow.com/questions/28571985/rails-remote-true-equivalent, но никто не ответил. Я надеюсь, это не значит, что вопрос невозможен.

У меня есть страница, где список людей можно перетаскивать и забрасывать в бункеры. Назначение в таблице соединений автоматически генерируется при их удалении. Тем не менее, я хочу, чтобы страница не перегружалась. В ruby ​​я сделал бы это с помощью remote: true, но re-direct здесь происходит в моем файле javascript. Я считаю, что все настроено правильно, если только я могу установить remote: true в конце моей строки window.location.pathname в файле .js.

z_game_sessions.js

app.gameSession = { 
    dragDrop: function() { 
    $('.groups-students').sortable({ 
     tolerance:"pointer", 
     revert: true 
    }); 

    $('.draggables').draggable({ 
     connectToSortable: '.groups-students', 
     revert: 'invalid', 
     stop: function (e) { 
     var id = e.target.id; 
     var groupId = $(this).closest('ul').attr('id'); 

     if (groupId) { 
      window.location.pathname = "game_sessions/add_player/" + groupId + "/" + id; 
     } 
     } 
    }); 

    } 
} 

game_sessions_controller.rb

def add_player 
    @game_session = Group.find(params[:group_id]).game_session 
    GroupAssignment.assign(params[:group_id], params[:student_id], @game_session.id) 
    respond_to do |format| 
     format.js 
    end 
    end 

add_player.js.erb

$("#new-group-form-container").html("<%= j(render partial: 'new_group_form', locals: {f: @game_session}) %>"); 

_new_group_form.html.erb

<%= f.simple_fields_for :groups do |ff| %> 
    <div class="mdl-cell mdl-cell--4-col mdl-shadow--4dp group-assignment-forms" id="group<%= "#{ff.object.id}" %>"> 

     <h3>Group</h3> 


     Password: <%= ff.object.password %> 
     <%= ff.input :name, label: "Group Name", wrapper_html: { class: "mdl-textfield mdl-js-textfield mdl-textfield--floating-label" }, input_html: { class: "mdl-textfield__input" }, label_html: { class: "mdl-textfield__label" } %> 
     <%= ff.input :_destroy, as: :boolean, label: "Remove Group" %> 

     <h4>Students</h4> 

     <ul class="groups-students student-drag-area" id="<%= "#{ff.object.id}" %>"> 
     <% ff.object.students.each do |student| %> 
      <li class="draggables" id="<%= student.id %>"><%= student.full_name %></li> 
     <% end %> 
     </ul> 

    </div> 
<% end %> 

Answer 1

Во-первых, это должен быть запрос POST. Измените маршруты.

Во-вторых, заставьте ваш контроллер вернуть html, а затем просто выполните запрос ajax. & назначьте этот перенастроенный html на успех.

Таким образом, вместо:

window.location.pathname = "game_sessions/add_player/" + groupId + "/" + id; 

это должно быть что-то вроде:

$.ajax({ 
    url: "game_sessions/add_player/" + groupId + "/" + id, 
    type: "POST", 
    success: function(data) { 
    $("#new-group-form-container").html(data) 
    } 
});