Question

我正在使用best_in_place gem在Rails应用程序中进行内联编辑。

我的对象的一个属性是text类型，我希望它在文本区域中进行编辑，所以我这样做了：

<%= best_in_place @myobject, :description, :type => :textarea %>

可行，但未编辑时，将删除所有返回（\ n）。

我尝试使用simple_format，将:display_with => :simple_format添加到传递给best_in_place的选项中：

<%= best_in_place @myobject, :description, :type => :textarea, :display_with => :simple_format %>

未编辑时，新行将按预期显示。但是点击进入版本会被破坏，上面会添加一个新的破折号。单击它会显示一个textarea框，但它是空的，输入的文本不会保存回我的对象。

我的属性中保存的内容只是纯文本，不包含任何HTML。

这个问题（和补丁）似乎与我的问题有关：https://github.com/bernat/best_in_place/pull/111
但是，在应用补丁（手动，到文件.../gems/best_in_place-1.0.6/spec/spec_helper.rb）时，我仍然遇到同样的问题。

Answer 1

我有同样的问题并通过绑定到best_in_place documentation中描述的“ajax：success”事件并将新行转换为<br />来解决它。

$('.best_in_place').bind('ajax:success', function(){ this.innerHTML = this.innerHTML.replace(/\n/g, '<br />') });

您还可以选择使用轻量级标记语言，例如textile或markdown，而不是简单的换行符。可以在here (textile)和here (markdown)找到Javascript转换器。

我选择了Textile，因为我可以在best_in_place的display_with选项中使用textilize方法。

更新的javascript：

$('.best_in_place').bind('ajax:success', function(){ $(this).JQtextile('textile', this.innerHTML) });

此外，如果您只想在best_in_place textareas上使用此行为，则可以检查data-type属性：

$('.best_in_place').bind('ajax:success', function(){ 
    if ($(this).attr('data-type') == 'textarea')
        $(this).JQtextile('textile', this.innerHTML) 
});

最后，匹配服务器端的转换：

:display_with => lambda { |v| textilize(v).html_safe } // the RedCloth gem may be required.

Answer 2

找到了半工作的解决方案。

在show.html.erb：

<%= best_in_place @myobject, :description, :type => :textarea, :display_as => 'description_format'  %>

和myobject.rb：

def description_format
  self.description.gsub(/\n/, "<br>")
end

它按预期工作。差不多。
唯一剩下的问题是：编辑文本时，在从textarea取消聚焦后，新行将再次丢失。如果刷新页面，它将再次正确显示。

Answer 3

如果\n被<br>替换，并且用户选择进行更多修改，则用户只会在一行上看到所有文字，这使得阅读和编辑更加困难。

根据上面的答案，我制作了这个解决方案，成功时删除了任何\r。

$('.best_in_place').bind('ajax:success', function(){ 
    if ($(this).attr('data-type') == 'textarea') {
        this.innerHTML = this.innerHTML.replace(/\r/g, '')
    }
});

这可确保不显示多余的行。此解决方案的优点是，如果用户选择再次编辑该字段，则所有内容都显示为之前。

Answer 4

我认为这里的答案都有效。这只是另一种选择。您可以在<pre>标记之间添加best_in_place字段，它将负责添加行。当然，需要进行一些格式化和样式更改，但它很容易解决手头的问题。

Answer 5

回答以下问题，了解更新后丢失的行格式。经过一些实验，我得到了这个工作。这是一个名为＆＃34; comment＆＃34;的字段示例。它用作textarea并在数据库中存储为类型文本。

表格形式：

div class: "single-spacing", id: "comment_div" do
    best_in_place coursedate, :comment, as: :textarea, url: [:admin,coursedate], ok_button: "Uppdatera", cancel_button: "Cancel", class: "editable", 
     :display_with => lambda { |c| simple_format(c.gsub("<br />", ""), {}, sanitize: false) }
end

在css中：

.single-spacing {
  ul br {
   display: none;
 }
  ol br {
  display: none;
 }
  div br {
   display: none;
  }
h3 {
  border-bottom: 1px dotted #e8e8e8;
   padding-bottom: 15px;
}
 blockquote {
   border-color: #a7c2d9;
    p {
      font-size: 14px;
      color: #777777;
      line-height: 1.5;
    }
  }
}

CoffeeScript的：

# refresh textarea bip on coursedate when edited to reload line breaks after update
  $('#comment_div').bind 'ajax:success', ->
  $('#comment_div').load(document.URL +  ' #comment_div');
  return

Answer 6

这对我有用。

  $('.best_in_place').bind 'ajax:success', -> 
    content = $(this).text().replace(/\n/g, "<br>")
    $(this).html(content)

或Jquery

$('.best_in_place').bind('ajax:success', function(){ 
    content = $(this).text().replace(/\n/g, "<br>")
    $(this).html(content)
});

使用Rails gem'best_in_place'进行内联编辑 - bug：在textarea上编辑后丢失新行

6 个答案: