TinyMCE4 file_picker_callback - возвращает дополнительные параметры

Question

Я использую свой собственный инструмент выбора файлов с новой функцией TinyMCE 4 file_picker_callback. Документация по этому вопросу невелика, поэтому спасибо Фреду за то, что он зашел так далеко - /questions/12159798/kak-mne-obnovit-plagin-tinymce-ispolzuya-tinymcepopupjs-dlya-versii-4/12159804#12159804

Пользовательский инструмент выбора файлов работает, и когда вы нажимаете на изображение, оно заполняет "Источник", а также "Размеры". Мне просто интересно, есть ли способ автоматически заполнить поле "Описание изображения".

Информация для изображений генерируется из таблицы базы данных, поэтому у меня уже есть описание, и было бы неплохо автоматически заполнить его для пользователя. После попыток различных способов передачи данных я пытаюсь понять, как это можно сделать.

Код для 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 еще не самые лучшие, так как я довольно новичок в этом, поэтому, если вы могли бы проиллюстрировать любые ответы примерами и / или ясной логикой, это было бы очень полезно и высоко ценится.

Answer 1

У меня была такая же проблема, и я нашел следующее решение:

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 параметр, который передается oninsert):

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

3. Обновите места, которые вы называете mySubmit заполнить objVals объект.

   Например:

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

   Свойства для заполнения objVals изменяются в зависимости от типа вызывающего диалога и (частично) документированы здесь.

   Для диалога ссылок:

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

   Для диалога изображений:

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

   Для медиадиалог:

   mySubmit("movie.mp4", {source2: 'movie-alt.ogg', poster: 'movie-image.jpg'});