Как я могу передать переменную частичному элементу, который загружается, когда пользователь нажимает на div?

#javascript #jquery #ruby-on-rails

#javascript #jquery #ruby-on-rails

Вопрос:

Я пытаюсь загрузить частичную, когда пользователь нажимает на элемент div. Моя проблема в том, что я хочу передать переменные этому частичному элементу, и я не могу найти способ.

Я написал следующий код:

 <script>
$(".conversation").click(function() {
<% @conversationId = capture do %>
<%= javascript_tag "$(this).attr('id');" %>
<% end %>
$("#conversation").html("<%= escape_javascript(render(:partial => 'conversations/conversation_home', :locals =>{:conversation => Conversation.find_by_id(@conversationId)} )) %>");
});
</script>
  

Я пытаюсь инициализировать переменную (@conversationId), а затем использовать ее для передачи нужного объекта частичному.
Когда я загружаю свою страницу, она также пытается загрузить частичную часть (почему? Я нигде не нажимал), и я получаю «неопределенный метод `subject’ для nil: NilClass», потому что диалог равен нулю.
Если я заменю @conversationId значением, диалог инициализируется правильно.

Почему частичное отображается при загрузке страницы, а не после того, как я нажимаю на div? И правильно ли я инициализирую @conversationId?

Есть ли другой подход, который я мог бы использовать?

Ответ №1:

Все, что находится между <% и %> , оценивается при загрузке страницы. Это ожидаемое поведение, и именно поэтому ваш частичный элемент загружается при загрузке страницы.

Используйте AJAX

Я бы лично использовал AJAX. Вот как я бы это сделал.

В HTML (добавьте div для каждого разговора с его id )

 <div class="conversation" data-conversation-url="<%= conversation_path(:id => 1) %>">Get Conversation</div>
  

В Javascript (я бы поместил его в отдельный файл)

     $(document).on('click', '.conversation', function() {
        $.get({
            url: $(this).data('conversation-url'),
            success: function() {
              // do something here
            },
            failure: function() {
              // do something here
            }
        });
    });
  

В conversations_controller

     def show
        @conversation = Conversation.find(params[:id])
    end
  

В views / conversations /show.js.erb

 $("#conversation").html("<%= escape_javascript(render(:partial => 'conversation_home', :locals =>{:conversation => @conversation} )) %>");
  

Это должно сработать.

Пожалуйста, обратите внимание, что это предполагает, что у вас уже установлен маршрут conversation_path . Кроме того, это всего лишь пример кода. Вам нужно будет изменить его в соответствии с вашими потребностями, добавить обработку ошибок и, возможно, изменить некоторый код на основе используемой версии jQuery и Rails.