Блог

Главная - Вопросы по программированию - Rails 3 визуализирует разные части с помощью ссылки

Rails 3 визуализирует разные части с помощью ссылки

#jquery #ruby-on-rails #ruby #ruby-on-rails-3

#jquery #ruby-on-rails #ruby #ruby-on-rails-3

Вопрос:

У меня есть проект для автодилера, и в машине show.html у меня есть фотогалерея в левой части страницы и информация о транспортном средстве в правой части. Код информации о транспортном средстве находится в частичном имени _vehicle_info , а галерея находится в _car_gallery этом, выглядит примерно так:

 <div id="column-left">
    <%= render :partial => "car_gallery" %>
</div>
<div id="column-right">
    <%= render :partial => "vehicle_info" %>
</div>

На car_gallery я вижу только 12 фотографий автомобиля.

Проблема:

Что я хочу сделать, так это разместить ссылку рядом car_gallery с div, и когда пользователь нажимает на нее vehicle_info , часть в левой части будет заменена на частичную car_gallery_all (эта часть содержит все фотографии для этой машины, не ограничиваясь 12). Есть ли какой-нибудь короткий способ сделать это? Пожалуйста, помогите.

Комментарии:

1. Это штука с javascript. Я добавил тег jQuery к вашему вопросу. Что вам нужно, так это заменить содержимое div, это можно легко сделать с помощью jQuery.

2. Вы хотите сделать это без обновления страницы?

3. да, без обновления .. вкладки jquery были бы одним из решений, но я ищу другой способ, если он есть.

Ответ №1:

Редактировать из-за отсутствия репутации:

Это будет работать в rails 3.1, не уверен в версии 3.0 или ниже..

Кроме того, ответ davidb, если я правильно понимаю, загрузит все изображения независимо от того, хочет ли пользователь их просматривать или нет — это решение будет загружать их только в том случае, если пользователь нажмет на ссылку, чтобы просмотреть их..

……………………………………………………………………

контроллер

                 def all_car_photos
                  ...
                  respond_to do |format|
                     format.js
                  end
                end

Вид

             <div id="column-left">
                <%= render :partial => "car_gallery" %>
            </div>
            <div id="column-right">
                <%= render :partial => "vehicle_info" %>
            </div>
            <%= link_to "Show All Photos", path_to_controller_action(@car), { :method => :get, :remote => true} %>

all_car_photos.js.erb

             $('#column-right').html("<%= escape_javascript(render "car_gallery_all") %>");

Итак, представление содержит метод link_to, который указывает на действие контроллера all_car_photos. Ключевым моментом здесь является то, что link_to содержит:remote => true — это отправляет запрос, используя встроенную в Rails функциональность AJAX.

Действие контроллера выполняет то, что ему нужно, но отвечает представлением .js — all_car_photos.js.erb — оно содержит строку jQuery, которая заменит содержимое div-файла ‘column-right’ на часть ‘car_gallery_all’..

Уже поздно, но эта настройка должна работать..

Комментарии:

1. Я пробую ваш пример и увижу результаты. Я вернусь с «принять ответ», когда выполню работу. Спасибо.

2. Не беспокойтесь. Однако это не копирование / вставка кода.. Это потребует настройки, но общая идея даст вам то, что вы хотите.

Ответ №2:

Добавьте ссылку и присвоите ей идентификатор. Вы используете «#», потому что он не ссылается ни на что эффективно.

 <%= link_to "my link text", "#", :id => "replace_vehicle_info" %>

Затем вы добавляете некоторый jQuery к своему public/javascript/application.js (я за исключением того, что вы используете rails 3, а не 3.1, потому что ваш вопрос помечен таким образом), чтобы заменить содержимое этого div.

 $("#replace_vehicle_info").click(function() {
     $("#vehicle_info").replaceWith(<your html here>)
})

Комментарии:

1. спасибо, я попробую это в качестве альтернативы для FiveOhOne asnwer.