javascript - Tinymce adding file picker button for adding links - Stack Overflow

admin管理员组

文章数量:1425699

I wanted to add a trigger button to upload image as a data. So I added the following piece of code

<textarea id="test"></textarea>
<input name="image" type="file" id="test-upload" class="hidden" onchange="">

tinymce.init({
            selector: '#test',
            ...,
            paste_data_images: true,
            image_advtab: true,
            file_picker_callback: function(callback, value, meta) {
                if (meta.filetype == 'image') {
                    jQuery('#test-upload').trigger('click');
                    jQuery('#test-upload').on('change', function() {
                        var file = this.files[0];
                        var reader = new FileReader();
                        reader.onload = function(e: any) {
                            callback(e.target.result, {
                                alt: ''
                            });
                        };
                        reader.readAsDataURL(file);
                    });
                }
            },
            ...
        });

This is working as expected. I am getting a file picker for the image as below

But I am also getting this file picker when I try to add link as well.

How to avoid this?

I wanted to add a trigger button to upload image as a data. So I added the following piece of code

<textarea id="test"></textarea>
<input name="image" type="file" id="test-upload" class="hidden" onchange="">

tinymce.init({
            selector: '#test',
            ...,
            paste_data_images: true,
            image_advtab: true,
            file_picker_callback: function(callback, value, meta) {
                if (meta.filetype == 'image') {
                    jQuery('#test-upload').trigger('click');
                    jQuery('#test-upload').on('change', function() {
                        var file = this.files[0];
                        var reader = new FileReader();
                        reader.onload = function(e: any) {
                            callback(e.target.result, {
                                alt: ''
                            });
                        };
                        reader.readAsDataURL(file);
                    });
                }
            },
            ...
        });

This is working as expected. I am getting a file picker for the image as below

But I am also getting this file picker when I try to add link as well.

How to avoid this?

• javascript
• tinymce
• tinymce-4
• tinymce-plugins

Share Improve this question Follow asked Aug 29, 2017 at 0:10 Abhijith NagarajaAbhijith Nagaraja 3,38066 gold badges3030 silver badges5757 bronze badges 2

• 1 If the answer below resolves the issue can you please accept the answer so others know the issue is resolved? – Michael Fromin Commented Aug 31, 2017 at 20:53
• @MichaelFromin: sorry I did not have time to check this till now. I will check this shortly and award it if it solves my issue. – Abhijith Nagaraja Commented Sep 7, 2017 at 19:33

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6 +25

Add the file_picker_types setting to your configuration and specify where the picker should be used.

https://www.tinymce./docs/configure/file-image-upload/#file_picker_types

The default is:

file_picker_types: 'file image media'

...but you can change it to:

file_picker_types: 'image media'

...at which point the picker won't appear for files (links).

本文标签： javascriptTinymce adding file picker button for adding linksStack Overflow