1

私はかなり長い間tinymceを使用してきました。そしてhttp://github.com/spohlenz/tinymce-railsに感謝しますしかし今、私 はRailsアプリのすべての指示に従ったbackbone-on-railsに 基づいてアプリにtinymceを含める必要があります。 アプリケーション.jsにバックボーンファイルの前後にtinymceを含めようとしました 私のバックボーンテンプレート


<textarea class="tinymce" id="article_body" rows='40' cols='120' >
  <%= @article.get('body') %>  
</textarea>

しかし、tinymceコントロールは初期化に失敗します。
私たちを手伝ってくれますか？

アップデート1
テンプレートとこれでtinymceを初期化してみました：
edit.jst.ecoで

<textarea class="tinymce" id="article_body<%= @article.get('id') %>" rows='40' cols='120' >
  <%= @article.get('body') %>
</textarea>  
<% tinyMCE.execCommand "mceAddControl", true, "article_body"+@article.get('id')%>

コントロールまたはテキストは、手動で更新した後にのみ表示されます（f5）

アップデート2
興味のあるビューのrenderメソッドにexecCommandメソッドを追加してみました。

class Notes.Views.ArticleEdit  
  render: ->  
    $(@el).html(@template(article: @model))  
    tinyMCE.execCommand "mceAddControl", false, "article_body"+@model.get('id')  
    this

アップデート1と比較して変更はありません。
アップデート3
は、レンダリング後にtinymceのバインドを試みました。2つのアプローチを使用：
1）

class Notes.Views.ArticleEdit  
  render: ->  
    $(@el).html(@template(article: @model))  
    setTimeout (->
      tinyMCE.execCommand "mceAddControl", true, "article_body" + @model.get("id")
    ), 100

変更はありません。更新のtinymceが表示された後のみ
2）http://fahad19.tumblr.com/post/28158699664/afterrender-callback-in-backbone-js-views

  class Notes.Views.ArticleEdit extends Backbone.View  
  initialize: ()->  
    _.bindAll this,  "render", "afterRender"  
    _this = this  
    @render = _.wrap(@render, (render) ->  
      render()  
      _this.afterRender()  
      _this  
    )  
    @model.on('change',@render,this)  
    @model.on('destroy',@remove,this)  
  afterRender: ->  
    console.log tinyMCE  
    tinyMCE.execCommand "mceAddControl", true, "article_body" + @model.get("id")

コンソール出力（適切なtinymceオブジェクト）を取得しますが、tinymceを取得しません:(

アップデート4
これはgithubのプロジェクトです

アップデート5
私は間違っていました-アイテムはルーターでレンダリングされた後のみDOMに表示されます。したがって、Notes.Routers.Articles＃editアクションを編集する必要があります

4

1 に答える 1

0

私の問題を修正するには、次のようにルーターのアクションを編集する必要がありました。

edit: (id)->  
    @model = @collection.get(id)  
    view = new Notes.Views.ArticleEdit(model: @model)  
    $('#container').html(view.render().el)  
    el_id = "article_body" + @model.get("id")  
    if (tinyMCE.getInstanceById(el_id)) {   
      tinyMCE.execCommand 'mceFocus', false, el_id  
      tinyMCE.execCommand "mceRemoveControl", false, el_id  
    }  
    tinyMCE.execCommand "mceAddControl", false, el_id  
    tinyMCE.triggerSave()*emphasized text
于 2013-03-07T11:51:28.003 に答える