Question

试图弄清楚如何动态填充对话框中的选择菜单...到目前为止，我的所有尝试都无法正常运行。

Answer 1

我认为你要做的就是动态填充下拉菜单插入。无论出于何种原因，下降需要填充对话框已打开。

如果是这样，这就是我为类似情况所做的事情：

{
    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元素。

可能有更好的方法可以做到这一点，但这对我有用。

Answer 2

鲍勃，

这是一个更改现有选择菜单项目的代码段。但是，您可以添加自己的，动态获取值等。

        //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;

如果这没有帮助，请提供有关实际结果与预期结果的其他详细信息。

Answer 3

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());
                    },

Answer 4

使用add（）方法并在列表中选择正确的项的改进代码。

{
    type: 'select',
    label: 'Select a page',
    id: 'localPage',
    items: [['', '']],
    setup: function(data) {
        var self = this;
        $.get('/pages.php', function(items) {
            items.forEach(function(item) {
                self.add(item[0], item[1]);
            });
            if (data.localPage) {
                self.setValue(data.localPage || '');
            }
        }).fail(function() {
            alert('An error occurred while getting the pages.');
        });
    },
}

pages.php示例脚本：

$pages = [
    ['Contact', '{!! page:4 !!}'],
    ['About', '{!! page:5 !!}'],
    ['Home page', '{!! page:1 !!}'],
];

return json_encode($pages);

CKeditor在对话框中动态选择

4 个答案: