Using Froala tribute js
Error:- Tribute.js:159 Tribute was already bound to BODY
When I am using froala fullPage.. And I have read the documentation as well and there is nowhere to mention this problem. The error is coming only when I am adding fullpage option and set it as true. This is not helping me to figure to any solution.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/tributejs@3.5.3/dist/tribute.js"></script>
<script src="https://cdn.jsdelivr.net/npm/froala-editor@3.1.0/js/froala_editor.pkgd.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/froala-editor@3.1.0/css/froala_editor.pkgd.min.css" rel="stylesheet"/>
<link href="https://cdn.jsdelivr.net/npm/tributejs@3.5.3/dist/tribute.css" rel="stylesheet"/>
<h4> with Tribute </h4>
<div id="Not working with Tribute"></div>
<h4> withoutTribute </h4>
<div id="Working with Tribute"></div>
<script>
var tribute = new Tribute({
values: [
{ key: 'Phil', value: 'pheartman' },
{ key: 'Gordon', value: 'gramsey' },
{ key: 'Jacob', value: 'jacob' },
{ key: 'Ethan', value: 'ethan' },
{ key: 'Emma', value: 'emma' },
{ key: 'Isabella', value: 'isabella' }
],
selectTemplate: function(item) {
return '<span class="fr-deletaable fr-tribute">' + item.original.key + '</a></span>';
}
})
new FroalaEditor('#withTribute', {
fullPage: true,
events: {
initialized: function() {
var editor = this;
tribute.attach(editor.el)
editor.events.on('keydown', function(e) {
if (e.which == FroalaEditor.KEYCODE.ENTER && tribute.isActive) {
return false;
}
}, true);
}
}
});
new FroalaEditor('#withoutTribute', {
fullPage: false,
events: {
initialized: function() {
var editor = this;
tribute.attach(editor.el)
editor.events.on('keydown', function(e) {
if (e.which == FroalaEditor.KEYCODE.ENTER && tribute.isActive) {
return false;
}
}, true);
}
}
});
</script>
