Question

I have a column in a table with data that uses a textarea that allows for in place editin using the best_in_place gem. It takes up a bit of space vertically. I want to show a preview of the text in the textarea and on the click of a button, the text will expand down and show the full textarea.

Is this possible?

    <td><%= best_in_place @obj, :comment , :type => :textarea %></td>

Answer 1

Textarea只能在其中包含文本，因此textarea本身不存在隐藏div等的范围。我能想到的最好的方法是隐藏真正的文本区域中的完整数据，并显示一个＆＃34;虚拟＆＃34; textarea（例如，名称为＆＃34; dummy＆＃34;），其中包含截断版本的数据。

然后，当用户点击按钮（或者可能是textarea中的任何位置）时，您会隐藏虚拟文本区域并显示真实文本区域。

你将需要阻止用户编辑虚拟textarea，因为这将被丢弃：这是一个很好的理由在他们点击它时立即替换真实的（或tab到它：你应该绑定实际上对焦点事件，因为这也会抓住标签。）

这样的事情：

<div>
  <div class="preview">
    <div>
      <%= text_area_tag "dummy", <%= truncate(@foo.body, :length => 100), :onfocus => "$(this).closest('.preview').hide().siblings().show();" %>
    </div>
    <%= button_to_function "Show all", "" %>
  </div>
  <div class="full-body" style="display: none;">
    <!-- proper textarea tag or whatever goes here -->
  </div>
</div>

Show preview text then show all (expand) on click of a button

1 个答案: