CKeditor在對話框中動態選擇

1

Bob，

這是一個片段，用於更改現有選擇菜單的項目。但是，你可以添加自己的，動態獲取值等

 //for button we just want to limit the button type to button 
    if (dialogName == 'button') { 

     // updates the info tab 
     var infoTab = dialogDefinition.getContents('info'); 
     var typeDef = infoTab.get('type'); 
     var buttonType = new Array("Button", "button"); 
     var myItems = new Array (buttonType); 
     typeDef['items'] = myItems;

如果沒有幫助，實際與預期的結果提供更多詳細信息。

來源

2011-03-14 12:54:57 rquinn

+0

欲填充選擇動態如：示例： ' CKEDITOR.dialog.add（ '富'，功能（編輯） \t { \t \t返回{ \t \t \t標題：'test'， \t \t \t resizable：CKEDITOR。DIALOG_RESIZE_BOTH， \t \t \t minWidth：500， \t \t \t了minHeight：400， \t \t \t內容：[ \t \t \t \t \t \t \t \t \t \t { \t \t \t \t \t \t \t類型：「塞萊CT」， \t \t \t \t \t \t \t標籤： '選擇考試：'， \t \t \t \t \t \t \t寬度：200， \t \t \t \t \t \t \t項目：[ \t \t \t \t \t \t \t \t \t \t [ '一個'，1]，[ '二'，2] \t \t \t \t \t \t \t \t \t] \t \t \t \t \t \t} \t \t \t \t \t \t \t \t \t \t] \t \t \t \t} \t \t \t] \t \t};; \t}）; ' – bclingan 2011-03-14 23:45:01

+0

您的代碼段很有幫助......但基本上我需要做的是通過外部來源填充選擇菜單，即類似ajax調用或許......似乎並沒有一個簡單的方法來做到這一點。有沒有，是否有可能「包裝」我想要做的一切iframe內的一切，打到另一個網頁。這將消除我不得不處理編輯器內部繁瑣的定義。 – bclingan 2011-03-15 02:37:14

+0

我不確定我是否理解，阻止您進行AJAX調用的是什麼？這些onDefinitions只被調用一次，而不是每次用戶點擊插件。或者在啓動過程中加載數據並將其存儲在DATA或其他地方，然後使用它。 – rquinn 2011-03-17 17:49:53

6

我想你要做的是在你的插件中動態地填充下拉菜單。無論出於何種原因，在打開對話框時需要填寫該下拉列表。

如果是這樣，這裏是我做了類似的情況：

{ 
    type: 'select', 
    id: 'exam_ID', 
    label: 'Select Exam', 
    items : [ ['--- Select an Exam---',0] ], 
    setup : function(element) { 
     var element_id = '#' + this.getInputElement().$.id; 
     $.ajax({ 
      type: 'POST', 
      url: 'lib/ckeditor/plugins/customExam/utilities/listExams.aspx', 
      data: '{"cpID":' + window.parent.$("#cpID").val() + '}', 
      contentType: 'application/json; charset=utf-8', 
      dataType: 'json', 
      async: false, 
      success: function(data) { 
       $.each(data.DATA, function(index, item) { 
        $(element_id).get(0).options[$(element_id).get(0).options.length] = new Option(item[1], item[0]); 
       }); 
      }, 
      error:function (xhr, ajaxOptions, thrownError){ 
       alert(xhr.status); 
       alert(thrownError); 
      } 
     }); 
    } 

}

的關鍵是發現CKEditor的設置，這是不是在元素定義的id元素ID。您可以使用該id作爲其他功能，但是如果您計劃對元素進行任何更新，則需要獲取CKEditor DOM元素。

可能有更好的方法來做到這一點，但這對我有用。

來源

2011-07-27 14:29:24 voidinutah

+0

我注意到，在'setup：'你沒有使用'element'參數 - 可以嗎？ – 2012-12-26 18:24:58

+0

我不知道爲什麼，但使用ckeditor 4.5.4時，我不得不使用'onLoad'事件而不是'setup'。 [dialog uiElement reference]（http://docs.ckeditor.com/#!/api/CKEDITOR.dialog.definition.uiElement）。 – jxmallett 2016-04-19 04:25:06

1

elements: [ 
       { 
        type: 'select', 
        id: 'test', 
        label: 'test label', 
        items: [ 
         ['Please Choose', ''] 
        ], 
        onLoad: function(element) { 
         this.add('Option 1', '1'); 
         this.add('Option 2', '2'); 
        }    
       } 
     ]

如果您想在對話框打開進行編輯時添加或刪除項目。您可以使用setup呼叫。將它放在onLoad的上方或下方。

    setup: function(element) { 
         this.clear(); 

         this.add('Please Choose', ''); 
         this.add('Option 1', '1'); 
         this.add('Option 2', '2'); 

         this.setValue(element.getText()); 
        },

來源

2014-08-21 13:06:56 electron

CKeditor在對話框中動態選擇

回答

相關問題