Loading Bootstrap Wysiwyg editor content

Question

Found this Save and Load Bootstrap Wysiwyg editor content . but loading does not work as suggested.

Created http://jsfiddle.net/vNPAJ/28/

jQuery

jQuery(document).ready(function ($) {            
            $("#t1").wysihtml5();
            $("#b1").click(function () {
                $("#t2").val($("#t1").val());                
            });
            $("#b2").click(function () {
                $("#t1").val($("#t2").val());
            });
        });

HTML

<textarea style="width:570px" id="t1">Test <b>Data</b></textarea><br /><br />
<textarea id="t2"style="width:570px"></textarea><br /> <br />
<button class="btn-primary" id="b1" type="button">Get</button>
<button class="btn-primary" id="b2" type="button">Set</button>

Get is working fine.

On clicking set button I want to fill editor with source from 2nd textarea.

Not sure how to do this...

Answer 1

Upon researching your issue. It seems that you need to use a hack in order to populate the value in wysihtml5() since it includes iframe

Try doing this, i added a line in #bt2 that set value to #t1

jQuery(document).ready(function ($) {            
            $("#t1").wysihtml5();
            $("#b1").on('click',function () {
                $("#t2").val($("#t1").val());                
            });
            $("#b2").on('click',function () {

                $("#t1").parent('body').find('iframe').contents().find('.wysihtml5-editor').html('I changed!');
            });
        });