TinyMCE API v4 windowManager.open - 我可以为body选项配置哪些小部件?

Ola*_*lav 40 dhtml modal-dialog tinymce-4

我想用Javascript生成的自定义HTML填充模态对话框的主体.

此方法文档大多是空的.

我只找到了一些例子

是否有可用类型的文档?更具体地说,是否有一种类型可以从Javascript变量向对话框的主体添加常规标记?

Muj*_*mas 106

在我美化了缩小版本的tinymce之后,我发现这些可能是windowManager.open的一些体型.我不知道如何使用它们,因为所有这些信息都是通过试用收集而失败的.由于文档非常糟糕,因此无法收集真实信息.这里还有一个链接,其中包含一些关于复选框的好信息.

https://wordpress.stackexchange.com/questions/172853/how-disable-checkbox-when-listbox-value-changes-in-tinymce

我花了一个小时左右的时间来检查和测试所有这些,所以我真的希望这样可以省去你自己做的麻烦.

LE:文本框参数:文本框设置表https://www.tinymce.com/docs/api/tinymce.ui/tinymce.ui.textbox/

LE2:你可以尝试浏览下面提到的所有tinymce.ui.*元素并检查它是否有设置表,我认为它可以用作身体的有效参数,如果他们有它

LE3:这是旧文档http://archive.tinymce.com/wiki.php/api4:index,因为它比新版本更有用,它是现在唯一可用的文档https://www.tinymce.com/docs/API /

                {
                    type   : 'listbox',
                    name   : 'listbox',
                    label  : 'listbox',
                    values : [
                        { text: 'Test1', value: 'test1' },
                        { text: 'Test2', value: 'test2' },
                        { text: 'Test3', value: 'test3' }
                    ],
                    value : 'test2' // Sets the default
                },
                {
                    type   : 'combobox',
                    name   : 'combobox',
                    label  : 'combobox',
                    values : [
                        { text: 'Test', value: 'test' },
                        { text: 'Test2', value: 'test2' }
                    ]
                },
                {
                    type   : 'textbox',
                    name   : 'textbox',
                    label  : 'textbox',
                    tooltip: 'Some nice tooltip to use',
                    value  : 'default value'
                },
                {
                    type   : 'container',
                    name   : 'container',
                    label  : 'container',
                    html   : '<h1>container<h1> is <i>ANY</i> html i guess...<br/><br/><pre>but needs some styling?!?</pre>'
                },
                {
                    type   : 'tooltip',
                    name   : 'tooltip',
                    label  : 'tooltip ( you dont use it like this check textbox params )'
                },
                {
                    type   : 'button',
                    name   : 'button',
                    label  : 'button ( i dont know the other params )',
                    text   : 'My Button'
                },
                {
                    type   : 'buttongroup',
                    name   : 'buttongroup',
                    label  : 'buttongroup ( i dont know the other params )',
                    items  : [
                        { text: 'Button 1', value: 'button1' },
                        { text: 'Button 2', value: 'button2' }
                    ]
                },
                {
                    type   : 'checkbox',
                    name   : 'checkbox',
                    label  : 'checkbox ( it doesn`t seem to accept more than 1 )',
                    text   : 'My Checkbox',
                    checked : true
                },
                {
                    type   : 'colorbox',
                    name   : 'colorbox',
                    label  : 'colorbox ( i have no idea how it works )',
                    // text   : '#fff',
                    values : [
                        { text: 'White', value: '#fff' },
                        { text: 'Black', value: '#000' }
                    ]
                },
                {
                    type   : 'panelbutton',
                    name   : 'panelbutton',
                    label  : 'panelbutton ( adds active state class to it,visible only on hover )',
                    text   : 'My Panel Button'
                },
                {
                    type   : 'colorbutton',
                    name   : 'colorbutton',
                    label  : 'colorbutton ( no idea... )',
                    // text   : 'My colorbutton'
                },
                {
                    type   : 'colorpicker',
                    name   : 'colorpicker',
                    label  : 'colorpicker'
                },
                {
                    type   : 'radio',
                    name   : 'radio',
                    label  : 'radio ( defaults to checkbox, or i`m missing something )',
                    text   : 'My Radio Button'
                }
Run Code Online (Sandbox Code Playgroud)

显示的Tinymce体型

  • tinymce文档,说得好听,很糟糕.谢谢你.仅供参考,`textbox`接受属性`multiline:true`,这将允许它像`textarea'一样行事. (31认同)
  • 我继续写了一篇文章,列出了可用的不同小部件和容器布局:http://makina-corpus.com/blog/metier/2016/how-to-create-a-custom-dialog-in-tinymce-4 (7认同)
  • 我为容器创建了一个可用小部件和布局的小提琴:https://jsfiddle.net/aeutaoLf/ (4认同)
  • 救命稻草!为什么tinyMCE不能携带这种信息? (3认同)

Ola*_*lav 11

谷歌搜索这个问题我找到了答案:

editor.windowManager.open({
    title: 'My dialog',
    body: [{
        type: 'container',
        html: "Hello world!"
    }]
});
Run Code Online (Sandbox Code Playgroud)