Встроенное редактирование с помощью Rails gem 'best_in_place' - ошибка: новые строки теряются после редактирования на textarea - PullRequest
11 голосов
/ 08 марта 2012

Я использую 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 %>

Когда они не редактируются, новые строки отображаются, как и ожидалось.Но щелчок, чтобы войти в издание, сломан, и новая черта добавлена ​​выше.При щелчке по нему отображается поле текстовой области, но оно пустое, и введенный там текст не сохраняется обратно в мой объект.

Содержимое, сохраненное в моем свойстве, представляет собой просто текст, оно не содержит HTML.


Эта проблема (и патч), похоже, связана с моей проблемой: https://github.com/bernat/best_in_place/pull/111
Однако при применении патча (вручную, к файлу .../gems/best_in_place-1.0.6/spec/spec_helper.rb) у меня все еще остается та же проблема.

Ответы [ 6 ]

7 голосов
/ 25 мая 2012

У меня была та же проблема, и я решил ее, связавшись с событием "ajax: success", как описано в документации best_in_place , и преобразовав новые строки в <br />.

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

Вы также можете использовать легкий язык разметки, такой как текстиль или разметка, вместо простых разрывов строк. Конвертеры Javascript для них можно найти здесь (текстиль) и здесь (уценка) .

Я пошел с Textile, так как я мог просто использовать метод textilize в опции display_with в best_in_place.

Обновленный JavaScript:

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

Кроме того, если вы хотите использовать это поведение только в текстовых областях best_in_place, вы можете проверить наличие атрибута типа данных:

$('.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.
4 голосов
/ 09 марта 2012

Найден полуработающий раствор.

В 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

Работает как положено.Почти.
Единственная оставшаяся проблема: когда вы редактируете текст, после того как вы не сфокусированы из текстовой области, новые строки снова теряются.Если вы обновите страницу, она снова будет отображаться правильно.

1 голос
/ 07 ноября 2012

Если \n заменить на <br> и пользователь решит сделать больше изменений, он увидит весь текст только в одной строке, что затруднит его чтение и редактирование.

На основеОтветы выше я сделал это решение, которое удаляет все \r в случае успеха.

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

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

0 голосов
/ 24 октября 2017

Это помогло мне.

  $('.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)
});
0 голосов
/ 28 августа 2017

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

В форме:

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
0 голосов
/ 10 февраля 2017

Я думаю, что ответы здесь все работают.Это просто еще одна альтернатива.Вы можете добавить поле best_in_place между тегами <pre>, и оно позаботится о добавлении строк.Конечно, потребуются некоторые изменения форматирования и стиля, но это легко решит проблему.

...