I am trying to get html code from ace editor and show preview in iframe
.
Example: Code Academy
Here is what i have been trying:
var textarea = $('textarea[name="html"]');
var view=$('#view');
textarea.hide();
var editor = ace.edit("editor");
editor.setTheme("ace/theme/eclipse");
editor.getSession().setMode("ace/mode/html");
editor.getSession().on('change', function () {
var preview = view.eval(editor.getSession().getValue());
});
setTimeout(preview, 300);
Try this:
var textarea = $('textarea[name="html"]');
var view=$('#view');
textarea.hide();
var editor = ace.edit("editor");
editor.setTheme("ace/theme/eclipse");
editor.getSession().setMode("ace/mode/html");
editor.getSession().on('change', function () {
view.contents().find('body').html(editor.getSession().getValue());
});
I presumed view
is your iframe
.
I am using the contents()
jQuery function to get into the iframe
and replace the html with what is in the editor.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With