Search code examples
jqueryiframewysihtml5

jQuery: changing iframe content

As far as I can tell this code should work, but it doesn't and I'm totally stumped. Any thoughts?

jQuery

$('.article_chooser').click(function() {
    var src = $(this).attr('value');
$("#doc_edits_attributes_0_body").parent("iframe html body").html($("#article"+src).html());
console.log($("#doc_edits_attributes_0_body").parent("iframe html body").html());
});

HTML

<textarea class="editable_areas" cols="40" id="doc_edits_attributes_0_body" name="doc[edits_attributes][0][body]" rows="20" style="display: none;"></textarea>
<iframe class="wysihtml5-sandbox" security="restricted" allowtransparency="true" frameborder="0" width="0" height="0" marginwidth="0" marginheight="0">
    <html>
        <body marginwidth="0" marginheight="0" contenteditable="true" class="editable_areas wysihtml5-editor" spellcheck="true">
        </body>
    </html>
</iframe>

Cheers!

Solution

  • wysihtml5 plugin has API, you can use getValue method:

    var value = editorInstance.getValue();

    Or if you want to set a value, you can use setValue method:

    editorInstance.setValue('a string');

    Or if you want to append html content you can use .exec() method:

    editorInstance.composer.commands.exec("insertHTML", "<p>bar</p>");