Print Page - Copy/Paste button in Easyui texteditor

I am trying to extend the text-editor extension toolbar to include copy and paste button. But this is not working.

Code:

$(function(){
$('#te').texteditor({
toolbar:['bold','italic','underline','justifyleft','justifycenter','justifyright','-','insertimage','Paste','Copy']
});
});

$.extend($.fn.texteditor.defaults.commands, {
'Paste': {
type: 'linkbutton',
iconCls: 'icon-paste',
onClick: function(){
$(this).texteditor('getEditor').texteditor('execCommand','paste');
}
}
});
$.extend($.fn.texteditor.defaults.commands, {
'Copy': {
type: 'linkbutton',
iconCls: 'icon-copy',
onClick: function(){
$(this).texteditor('getEditor').texteditor('execCommand','copy');
}
}
});

I am using the latest version of firefox.

// var result = document.queryCommandSupported('copy');
// console.log(result); return true
// var result = document.queryCommandSupported('Paste');
// console.log(result); return false

Please help.

The 'paste' command does not supported in many browsers. The alternative solution is to store the current selected text and then insert into the editor when the 'paste' button is pressed. Please refer to the code below:

Code:

$.extend($.fn.texteditor.defaults.commands, {
'Paste': {
type: 'linkbutton',
iconCls: 'icon-paste',
onClick: function(e){
var s = $('#myclipboard').html();
$(this).texteditor('getEditor').texteditor('insertContent', '<span>'+s+'</span>');
}
}
});
$.extend($.fn.texteditor.defaults.commands, {
'Copy': {
type: 'linkbutton',
iconCls: 'icon-copy',
onClick: function(){
var s = window.getSelection();
var cb = $('#myclipboard');
if (!cb.length){
cb = $('<div id="myclipboard" style="display:none"></div>').appendTo('body');
}
cb[0].innerHTML = s;
}
}
});

EasyUI Forum

General Category => General Discussion => Topic started by: Alfred on August 04, 2018, 04:38:51 AM