TinyMCE4 file_picker_callback - 返回其他参数

时间:2014-07-23 00:32:22

标签: javascript callback tinymce tinymce-4 filepicker

我正在使用自己的自定义文件选择器和TinyMCE 4的新file_picker_callback函数。关于这方面的文件并不是很好,所以我很荣幸能让我这么做 - https://stackoverflow.com/a/24571800/2460995

自定义文件选择器正在运行,当您点击图片时,它会填充"来源"以及"维度"。我只是想知道是否有任何方法可以自动填写"图像描述"领域也是如此。

图像的信息是从数据库表生成的,所以我已经有了描述,自动为用户填写它会很好。在尝试了各种传递数据的方法后,我很难理解如何做到这一点。

TinyMCE代码:

tinymce.init({
    ...
    file_picker_callback: function(callback, value, meta) {
        myImagePicker(callback, value, meta);
    }
});

function myImagePicker(callback, value, meta) {
    tinymce.activeEditor.windowManager.open({
        title: 'Image Browser',
        url: '/media/browser/1?type=' + meta.filetype,
        width: 800,
        height: 550,
    }, {
        oninsert: function (url) {
            callback(url);
        }
    });
};

自定义文件选择器的代码:

$(function(){
    $('.img').on('click', function(event){
        mySubmit('/upload/' + $(this).data('filename'));
    });
});

function mySubmit(url) {
    top.tinymce.activeEditor.windowManager.getParams().oninsert(url);
    top.tinymce.activeEditor.windowManager.close();
}

我的javascript知识并不是最好的,因为我对它很陌生,所以如果你可以用例子和/或明确的逻辑说明任何答案,这些答案非常有用并且非常感激。< / p>

1 个答案:

答案 0 :(得分:15)

我遇到了同样的问题,并提出了以下解决方案:

  1. 更新您的myImagePicker功能(请注意objVals功能的新oninsert参数:

    function myImagePicker(callback, value, meta) {
        tinymce.activeEditor.windowManager.open({
            title: 'Image Browser',
            url: '/media/browser/1?type=' + meta.filetype,
            width: 800,
            height: 550,
        }, {
            oninsert: function (url, objVals) {
                callback(url, objVals);
            }
        });
    };
    
  2. 更新您的mySubmit功能(请注意传递给objVals的{​​{1}}参数):

    oninsert
  3. 更新您致电function mySubmit (url, objVals) { top.tinymce.activeEditor.windowManager.getParams().oninsert(url, objVals); top.tinymce.activeEditor.windowManager.close(); return false; } 的地点以填写mySubmit对象。

    例如:

    objVals

    mySubmit("https://google.com", { text: "Go To Google", target: '_blank' }); 填写的属性会根据调用对话框的类型进行更改,并且(部分)记录here

    对于链接对话框:

    objVals

    对于图像对话框:

    mySubmit("https://google.com", { text: "Go To Google", target: '_blank' });
    

    对于mediadialog:

    mySubmit("image.jpg", { alt: "My image" });