Integration of WYSIWYG editor to best-in-place textarea

Question

I\'m using best_in_place gem to editing client\'s info in-place.

My question is, how can I integrate a WYSIWYG Editor for editing this content as HTML? I\'m currently us

Answer 1

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)

In 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 }
  %>

In coffee script file:

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])

In show.json.jbuilder:

json.extract! @client, :info, ...