Рельсы усекаются с помощью переключателя 'read more'

У меня есть абзац, который я хочу усечь с помощью кнопки "читать больше" и открыть слайд с остальной частью содержимого. Содержимое поступает из поля базы данных. Вот что у меня для усечения:

<%= truncate(@major.glance, :length => 250, :omission => '... Read More')%>

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

Ответ 1

Вы можете попробовать следующее

<div>
  <% if @major.glance.length > 250 %>
    <%= link_to_function truncate(@major.glance, length: 250), "$(this).parent().html('#{escape_javascript @major.glance}')" %>
  <% else %>
    <%= @major.glance %>
  <% end %>
</div>

или если вы предпочитаете использовать ссылку Read more

<div>
  <% if @major.glance.length > 250 %>
    <%= truncate(@major.glance, length: 250) %>
    <%= link_to_function '...Read more', "$(this).parent().html('#{escape_javascript @major.glance}')" %>
  <% else %>
    <%= @major.glance %>
  <% end %>
<div>

UPDATE

Так как в Rails 4, link_to_function устарел, и рекомендуется иметь неинтрузивные js, используйте следующие

<div>
  <% if @major.glance.length > 250 %>
    <%= truncate(@major.glance, length: 250) %>
    <%= link_to '...Read more', '', class: "read-more-#{@major.id}" %>
    <script>
      $('.read-more-<%= @major.id %>').on('click', function(e) {
        e.preventDefault()
        $(this).parent().html('<%= escape_javascript @major.glance %>')
      })
    </script>
  <% else %>
    <%= @major.glance %>
  <% end %>
<div>

Ответ 2

Я знаю, что присоединяюсь к этому разговору немного поздно. Я занимаюсь той же проблемой, пытаясь решить вышеперечисленное решение, которое прекрасно работает. Однако SEO-мудрый контент, который был скрыт, не был проиндексирован поисковыми системами. Я также проверил Lynx, и ссылка не может быть выполнена (очевидно). Таким образом, решение для этого решения было Jed Foster | readmore.js - lynx может прочитать его правильно, и теперь я жду обновления индекса SE и посмотрю, смогу ли я найти результаты поиска. На всякий случай кто-то находится в подобной ситуации...