javascript - CKEDITOR 对话框 - 单击按钮打开第二个选项卡

Question

我有带有两个选项卡的 CKEDITOR 对话框: - 查看一个 - 查看两个

在 View 一内，我有一个按钮，如果用户单击该按钮，应打开 View 二。

但我不知道该怎么做。这是我的 CKEDITOR.dialog 代码:

CKEDITOR.dialog.add('placeholder', function(editor) {
    var lang = editor.lang.placeholder,
        generalLabel = editor.lang.common.generalTab,
        validNameRegex = /^[^\[\]<>]+$/;

    return {
        title: 'some title',
        minWidth: 300,
        minHeight: 150,
        contents: [{
            id: 'initial-view',
            label: 'view one',
            title: generalLabel,
            elements: [{
                id: 'name-one',
                style: 'width: 100%;',
                type: 'html',
                html: 'Organizational units'
            }, {
                type: 'button',
                id: 'buttonId',
                label: 'Click me',
                title: 'My title',
                setup: function(widget) {

                    },
                onClick: function(widget) {
                    // this = CKEDITOR.ui.dialog.button
                    My code should go here........?
                }
            }]
        }, {
            id: 'organizational-unit-view',
            label: 'view two',
            title: generalLabel,
            elements: [
                // Dialog window UI elements.
                {
                    id: 'list-of-vars',
                    style: 'width: 100%;',
                    type: 'html',
                    html: 'second view --- html goes here',
                    label: lang.name,
                    setup: function(widget) {
                        this.setValue(widget.data.name);
                    },
                    commit: function(widget) {
                        widget.setData('name', this.getValue());
                    }
                }
            ]
        }]
    };
});

我的问题是我应该如何处理按钮点击？我应该使用什么方法？基本上如何打开 View 二？

Answer 1

我找到了解决方案。点击事件应该使用 getDialog():

 this.getDialog().selectPage('your-content-id);

像这样:

onClick: function(widget) {
    this.getDialog().selectPage('organizational-unit-view');
}