2013-10-21 72 views
2

是否有可能爲創建/編輯動作添加jQuery jtable插件的tinymce編輯器?jquery jtable與tinymce

我是jTable插件的新手,但我需要在jQuery jtable的創建/編輯動作中的一個字段的tinymce編輯器,所以我不知道可以使用jtable嗎?

我知道我可以在創建/編輯窗體中創建一個jtable字段作爲textarea,所以我想知道我是否可以在某處添加tinymce?

1)如果我用簡單的標準代碼在主網頁(其中JTable中被稱爲)加入TinyMCE的,再沒有什麼happends創建/編輯記錄(不TinyMCE的):

<script type="text/javascript"> 
    tinymce.init({ 
     selector: "textarea"   
    }); 
</script> 

2)我也試過編輯添加tinymce到每個textarea的核心jtable文件。它顯示我tinymce編輯器,但問題是與POST。當我張貼形式時,總是給我空值(應該用tinymce編輯的值)。

這是我如何追加在JTable中的腳本直接TinyMCE的:

.append('<script>tinymce.init({selector: "textarea"});</script>'); 

3),最後覺得我試過了,使用JTable的輸入選項字段:

article: { 
    title: 'Article',      
    input: function (data) { 
     return 'tinymce.init({selector: "textarea"});<textarea></textarea>'; 
    }, 

這吉斯我一些語法錯誤。我有一些語法錯誤,但我相信我可以使用這樣的東西。

回答

1

試試這個代碼:

formCreated: function(event, data) 
      { 
       tinymce.init({ 
        selector: "textarea" 
       }); 
      } 
1

測試後,似乎this solution修復與TinyMCE的不保存到textarea的問題(原因 - 的JTable內提交事件過載)。另外,當jTable關閉並重新打開編輯窗格時,this solution將卸載並重新加載TinyMCE。

把它們放在一起 - 這爲我工作:

formCreated: function (event, data) { 

    tinymce.init({ 
     selector: 'textarea', 
     setup: function (editor) { 
      editor.on('change', function() { 
       editor.save(); 
      }); 
     } 
    }); 

    for (var editor_id in tinyMCE.editors) { 
     tinyMCE.editors[editor_id].getBody().setAttribute('readonly', '1'); 
     tinymce.EditorManager.execCommand('mceAddControl', true, editor_id); 
     tinymce.EditorManager.execCommand('mceAddEditor', true, editor_id); 
    } 

}, 
formClosed: function (event, data) { 

    for (var editor_id in tinyMCE.editors) { 
     tinyMCE.editors[editor_id].getBody().setAttribute('readonly', '1'); 
     tinymce.EditorManager.execCommand('mceRemoveControl', true, editor_id); 
     tinymce.EditorManager.execCommand('mceRemoveEditor', true, editor_id); 
    } 

}