You need to be logged in to post in the forum - Log In
An active JCE Pro Subscription is required to post in the forum - Buy a Subscription
- Support
- Forum
- JCE Editor
- Live-update div from JCE in frontend
Support is currently Online
Official support hours:
Monday To Friday
From 09:00 To 17:00 Europe/London (BST)
From 09:00 To 17:00 Europe/London (BST)
Heyh JCE-ppl,
I'm working on a project where we gather form elements and presenting them in a "preview". By jquery 3.3.1 we live update the preview of form fields and image uploads.
Now my issue is that I can't get the .keyup event to trigger from within the iframe created be JCE.
$('body.mceIframeContainer', $('iframe#description_ifr').contents()).on('change keyup paste click focus', function(e) {
alert('testing');
});
binding and observe alså does not work.
Is it posible to get the live typing, pasting of content to go to parentwindow and update the div container?
Should i build it into the iframe? and what files wwould that be to modderate?
PS: I can transfer the content just fine by adding a button outside the iframe.
Thanx
I'm working on a project where we gather form elements and presenting them in a "preview". By jquery 3.3.1 we live update the preview of form fields and image uploads.
Now my issue is that I can't get the .keyup event to trigger from within the iframe created be JCE.
$('body.mceIframeContainer', $('iframe#description_ifr').contents()).on('change keyup paste click focus', function(e) {
alert('testing');
});
binding and observe alså does not work.
Is it posible to get the live typing, pasting of content to go to parentwindow and update the div container?
Should i build it into the iframe? and what files wwould that be to modderate?
PS: I can transfer the content just fine by adding a button outside the iframe.
Thanx
This is best done using the API, eg:
(function() {
tinyMCE.onAddEditor.add(function (mgr, ed) {
ed.onNodeChange.add(function() {
var content = ed.getContent();
// update external forms etc. with content
console.log(content);
});
});
})();
Just because you're not paranoid doesn't mean everybody isn't out to get you.
This is best done using the API, eg:
(function() {
tinyMCE.onAddEditor.add(function (mgr, ed) {
ed.onNodeChange.add(function() {
var content = ed.getContent();
// update external forms etc. with content
console.log(content);
});
});
})();
Just because you're not paranoid doesn't mean everybody isn't out to get you.
Heyh Ryan,
That got me some of the way - so that for leading me on.
.onNodeChange only updates on "enter"-pressed.
This code did the trick
That got me some of the way - so that for leading me on.
.onNodeChange only updates on "enter"-pressed.
This code did the trick
(function() {
tinyMCE.onAddEditor.add(function(mgr, ed) {
ed.onKeyUp.add(function() {
var content = ed.getContent();
$('.livepreviewdfull').html(content);
console.log("We are updating content - please hold");
console.log(content);
});
});
})();
If you are using keyup it's probably a good idea to debounce the callback, eg:
(function() {
function debounce(callback, time) {
var timer, func;
func = function () {
var args = arguments;
clearTimeout(timer);
timer = setTimeout(function () {
callback.apply(this, args);
}, time);
};
func.stop = function () {
clearTimeout(timer);
};
return func;
}
tinyMCE.onAddEditor.add(function(mgr, ed) {
var keyup = debounce(function (e) {
var content = ed.getContent();
$('.livepreviewdfull').html(content);
console.log("We are updating content - please hold");
console.log(content);
}, 200);
ed.onKeyUp.add(keyup);
});
})();
Just because you're not paranoid doesn't mean everybody isn't out to get you.
- Page :
- 1
There are no replies made for this post yet.
Be one of the first to reply to this post!
Be one of the first to reply to this post!