Render page rails, modal

Question

В настоящее время я пытаюсь оптимизировать рендеринг страницы в рубине на рельсах.

У меня есть вопрос, есть ли способ сделать страницу, только визуализировать другую страницу при нажатии на ссылку (href), связанную с ней.

некоторые коды index.html.erb:

..... 
..... 
<h4> 
    <%= item.name %> 
    <br/><a href="#<%=itemt.id%>_item_modal">Details</a> 
</h4> 

<div id="<%=item.id%>_item_modal" class="modal fullscreen"> 
    <div class="item-modal"> 
    <%=render item%> 
    </div> 
</div> 
..... 
..... 

В коде выше, я использую покадрово. Чтобы щелкнуть ссылку, будет отображаться _item.html.erb на более мелкой странице. Похоже на всплывающее окно.

Когда index.html.erb загружен, то все коды внутри _item.html.erb также будут загружены автоматически, и все запросы внутри будут выполнены из

<%render item%> 

кода.

Что я хочу, я не хочу, чтобы index.html.erb также отображал весь элемент внутри страницы _item.html.erb, если я не нажму кнопку «Подробности».

<br/><a href="#<%=itemt.id%>_item_modal">Details</a> 

Я думаю, что, делая это думать, что я могу сэкономить некоторое количество времени, когда пользователь запрашивает страницу элемента, так как система не требует, чтобы получить всю информацию, которая еще не требуется.

Помогите мне, ребята?

Пожалуйста, дайте мне знать, если вам нужна другая информация.

Answer 1

Для этого вам необходимо использовать ajax. Вы можете создать скрытый div с определенным идентификатором, например «модальный».

Откат ваш h4 к этому:

<h4> 
    <%= item.name %> 
    <br/> 
    = link_to 'Details', item_path(item), data: {remote: true}, item_details: true 
</h4> 

Тогда в контроллере элемента, на шоу действия:

def show 
    # load the item 
    if params[:item_details] 
    respond_to {|format| format.js} 
    else 
    # do what you already do here 
    end 
end 

И в вашем пункте просматривает папку, создайте файл show.js (. кофе):

$('#modal').html('<%= j(render partial: "item", object: @item) %>'); 
$('#modal').modal('show'); 

Это просто идея, вы должны сделать его совместимым с вашим кодом.

Answer 2

Если вы хотите пойти Аякса маршрут:

<h4> 
    <%= item.name %> 
    <br/> 
    <%= link_to "Details", item_path(item), remote: true %> 
</h4> 

Затем в items_controller:

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

Затем создается представление "просмотр/элементы/show.js"

$(body).append(<%= escape_javascript(render partial: "items/item_modal") %>); 
...code to show modal... 
...hook to remove modal when it is dismissed... 

И вид "взгляды/предметы/_item_modal.html.erb"

<div id="<%=item.id%>_item_modal" class="modal fullscreen"> 
    <div class="item-modal"> 
    <%=render item%> 
    </div> 
</div>