Codeigniter: TinyMCE image manager dynamic image paths Codeigniter: TinyMCE image manager dynamic image paths codeigniter codeigniter

Codeigniter: TinyMCE image manager dynamic image paths


I've just custom tinymce image but not using TinyMCE image manager.

but I use the tutorial from the link below.

How-to implement a custom file browser

<!-- Start tinymce custom --><script type="text/javascript"> tinyMCE.init({  <!--       your tiny mce init here    --->   <!-- custom file browser callback -->   file_browser_callback : 'myFileBrowser', });function myFileBrowser (field_name, url, type, win) {  // this is your dynamic image path  var cmsURL = "<?php echo base_url() ?>admin/media/select_image";  <== you can set as you wishif (cmsURL.indexOf("?") < 0) {  //add the type as the only query parameter  cmsURL = cmsURL + "?type=" + type;   }else {  //add the type as an additional query parameter   // (PHP session ID is now included if there is one at all)cmsURL = cmsURL + "&type=" + type;}   tinyMCE.activeEditor.windowManager.open({file : cmsURL,width : 600,height : 600,resizable : "yes",inline : "yes",close_previous : "yes",popup_css : true // Disable TinyMCE's default popup CSS}, {window : win,input : field_name});return false;}</script>


Add a "data-" attribute to your tinymce element and echo your desired url from there. Then in tinymce activeEditor, access that data- attribute value.

Textarea

<textarea name="description" class="tinymceDescription" data-uploadLink="<?php echo DIR_IMAGES; ?>" ></textarea>

TinyMce

tinymce.init({    // other settings here    //either use this if you are uploading automatically.    images_upload_url: $(tinymce.activeEditor.targetElm).attr("data-uploadLink"),    //or use this if you want to override tinymce auto upload.    images_upload_handler: function (blobInfo, success, failure) {        var xhr, formData;        var uploadLink = $(tinymce.activeEditor.targetElm).attr("data-uploadLink");        xhr = new XMLHttpRequest();        xhr.withCredentials = false;        xhr.open('POST', uploadLink);        xhr.onload = function () {            var json;            if (xhr.status != 200) {                failure('HTTP Error: ' + xhr.status);                return;            }            json = JSON.parse(xhr.responseText);            if (!json || typeof json.location != 'string') {                failure(xhr.responseText);                return;            }            success(json.location);        };        formData = new FormData();        formData.append('file', blobInfo.blob(), blobInfo.filename());        xhr.send(formData);    }});

The point here is to show you how i got a dynamic upload url into tinymce from the currently selected tinymce instance. The way you upload is your choice which i hope you know how to handle. But ether way, i have provide both the automatic and custom examples.