Javascript tinymce插件-如何从多个选项卡获取数据?
下面是javascript代码。我使用的是Javascript tinymce插件-如何从多个选项卡获取数据?,javascript,tinymce-4,tinymce-plugins,Javascript,Tinymce 4,Tinymce Plugins,下面是javascript代码。我使用的是bodyType:'tabpanel',因为我想要两个选项卡。问题是当onsubmit:function(e){console.log(e.data);}激发时,我只得到对象{nameA:“aaa”,ageA:“a1”}的输出。那么如何从选项卡B获取数据呢 (function() { /* Register the buttons */ tinymce.create('tinymce.plugins.MyButtons', {
bodyType:'tabpanel'
,因为我想要两个选项卡。问题是当onsubmit:function(e){console.log(e.data);}
激发时,我只得到对象{nameA:“aaa”,ageA:“a1”}的输出。那么如何从选项卡B获取数据呢
(function() {
/* Register the buttons */
tinymce.create('tinymce.plugins.MyButtons', {
init : function(editor, url) {
editor.addButton('themedropdownbutton', {
title : 'My dropdown button',
type: 'menubutton',
text: 'Theme Shortcodes',
menu: [
{
text: 'Tabs Example',
onclick: function() {
var win = editor.windowManager.open( {
title: 'Content Tabs',
bodyType: 'tabpanel',
body: [
{
title: 'My Tab A',
type: "form",
items: [
{ name: 'nameA', type: 'textbox', label: 'Your Name TAB A' },
{ name: 'ageA', type: 'textbox', label: 'Your Age TAB A' },
]
},
{
title: 'My Tab B',
type: "form",
items: [
{ name: 'nameB', type: 'textbox', label: 'Your Name TAB B' },
{ name: 'ageB', type: 'textbox', label: 'Your Age TAB B' },
]
},
],
onsubmit: function( e ) {
console.log(e.data); // output only this - Object { nameA: "aaa", ageA: "a1" }
// where is { nameB: "bbb", ageB: "b1" } ?????
}
});
}
},
{
// other functions
},
] // end menu:
});
},
createControl : function(n, cm) {
return null;
},
});
tinymce.PluginManager.add( 'my_button_script', tinymce.plugins.MyButtons );
})();
好的,终于找到答案了,如果你有同样的问题,用这个
onsubmit: function( e ) {
var alldata = win.toJSON();
console.log(JSON.stringify(alldata)); // just for testing, you don't need this line
// You can then access the results with this example
editor.insertContent('Tab A name is ' + alldata.nameA + '; Tab B name is ' + alldata.nameB);
editor.insertContent('Tab A age is ' + alldata.ageA + '; Tab B age is ' + alldata.ageB);
}
在中找到了一个参考,我找到了(对我来说)更好的解决方案。而不是
...
bodyType: 'tabpanel',
body: [...]
...
你们可以在身体内部做tabpanel。
它应该是这样的:(我简化了您的示例,并在提交和插入一些内容时发出完整数据警报)
(…)
editor.windowManager.open({
标题:“内容选项卡”,
//bodyType:'tabpanel',您可以使用以下代码简单地从所有选项卡获取所有字段
onsubmit:函数(b){
var-win=b.control.rootControl;
警报(JSON.stringify(win.toJSON());
}
(...)
editor.windowManager.open({
title: 'Content Tabs',
//bodyType: 'tabpanel', <- delete this
body: [
{type: 'container', label:'My all tabs'}, //it's not necessary, but shows, that other things can be there
{
title: 'Tabpanels',
type: 'tabpanel',
items: [
{
title: 'My Tab A',
type: "form",
items: [
{name: 'nameA', type: 'textbox',
label: 'Your Name TAB A' },
{ name: 'ageA', type: 'textbox',
label: 'Your Age TAB A' }
]
},
{
title: 'My Tab B',
type: "form",
items: [
{ name: 'nameB', type: 'textbox',
label: 'Your Name TAB B' },
{ name: 'ageB', type: 'textbox',
label: 'Your Age TAB B' }
]
}
]
}
],
onsubmit: function(e) {
editor.selection.setContent('[Tested menu');
editor.insertContent(' TabA name: ' + e.data.nameA);
editor.insertContent(", TabB name: " + e.data.nameB +']');
alert(e.data.toSource());
}
}
...