将WYSIWYG编辑器集成到最佳原位textarea [英] Integration of WYSIWYG editor to best-in-place textarea
问题描述
我正在使用best_in_place gem来就地编辑客户的信息。
I'm using best_in_place gem to editing client's info in-place.
我的问题是,我如何整合WYSIWYG编辑器以将此内容编辑为HTML?
我目前正在使用这个编辑器: https://github.com/Nerian/bootstrap-wysihtml5-rails /
My question is, how can I integrate a WYSIWYG Editor for editing this content as HTML? I'm currently using this editor: https://github.com/Nerian/bootstrap-wysihtml5-rails/
我不擅长javascript和cofeescript,所以我可能做错了。
I'm not good at javascript and cofeescript, so I'm probably doing something wrong.
我的视野中的代码:
<%= best_in_place @client, :info, :type => :textarea, :nil => "Click here to add content!", :html_attrs => { class: "wysihtml5" }, :sanitize => false %>
和clients.js.cofee
$(document).ready ->
# Activating Best In Place
jQuery(".best_in_place").best_in_place()
# Loading editor
$(".wysihtml5").each (i, elem) ->
$(elem).wysihtml5()
有谁知道怎么办?
谢谢
推荐答案
试试这样, inner_class: wysihtml5如果存在激活WisiHTML5编辑器,必须存在按钮保存和取消(默认事件处理程序已禁用以便正确工作)
Try like this, inner_class: "wysihtml5" if present activate WisiHTML5 editor, buttons 'Save' and 'Cancel' must be present (default event handler disabled for correct work)
在show.html.erb中:
<%= best_in_place @client, :info, type: :textarea,
nil: "Click here to add content!",
inner_class: "wysihtml5",
sanitize: false,
ok_button: 'Save',
cancel_button: 'Cancel',
display_with: lambda { |v| v.html_safe }
%>
在咖啡脚本文件中:
jQuery ->
# WisiHTML5 Edit
$('.best_in_place')
# append
.best_in_place()
# init
.on 'best_in_place:activate', () ->
if $(this).attr('data-inner-class') == 'wysihtml5'
html = $(this).attr('data-original-content')
area = $('textarea', this)
area.addClass('span7').unbind('blur')
area.wysihtml5().data('wysihtml5').editor.on 'load', (e)->
this.setValue(html, true)
# update
.on 'best_in_place:success', (e, data) ->
if $(this).attr('data-inner-class') == 'wysihtml5'
attr = $(this).attr('data-attribute')
data = jQuery.parseJSON(data)
if data[attr]
$(this).attr('data-original-content', data[attr])
$(this).html(data[attr])
在show.json.jbuilder中:
json.extract! @client, :info, ... <any other attributes>
这篇关于将WYSIWYG编辑器集成到最佳原位textarea的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!