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在对话框中动态选择

回答

相关问题