Can you save and load text file in an iframe or openWYSIWYG?

2

I really liked the code to save and load text in textarea of a post here. However I would like to know if you have any similar code to do the same function with iframe instead of textarea or that works correctly in the openWYSIWYG textarea. If anyone could help me, I would greatly appreciate it.

You can see an example of what I'm trying to do in this link .

I tried to improvise the complete code below in openWYSIWYG which is textarea and also does not work. Does anyone know why?

function saveTextAsFile() {
  var textToWrite = document.getElementById("inputTextToSave").value;
  ...
  function loadFileAsText() {
  var fileToLoad = document.getElementById("fileToLoad").files[0];
  var fileReader = new FileReader();  ...
    
asked by anonymous 10.10.2015 / 03:18

1 answer

2

Sorry if my answer does not go directly to the requirement of the question, but I believe the approach is not correct.

openWYSIWYG

I did a little research on openWYSIWYG and it looks like the project has not been maintained for some years. The first signal occurred when I tried to open it on my Chrome and popped up saying that my browser is not supported. I tried opening in Firefox and the images did not load.

I do not recommend using this editor .

iframe

Using iframe to get formatting is not necessary directly. Just use a WYSIWYG editor that works and does the work for you.

TinyMCE

There are several publishers, but what I have a little more familiarity with is TinyMCE .

See a example :

<script type="text/javascript">
tinymce.init({
    selector: "textarea",
    plugins: [
        "advlist autolink lists link image charmap print preview anchor",
        "searchreplace visualblocks code fullscreen",
        "insertdatetime media table contextmenu paste"
    ],
    toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
});
</script>

<form method="post" action="dump.php">
    <textarea name="content"></textarea>
</form>

To load and save the content being edited you can use the methods getContent and setContent .

CKEditor

Another popular alternative, but one I've never used, is the CKEditor .

A simple example ( extracted from the documentation ):

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>A Simple Page with CKEditor</title>
        <!-- Make sure the path to CKEditor is correct. -->
        <script src="../ckeditor.js"></script>
    </head>
    <body>
        <form>
            <textarea name="editor1" id="editor1" rows="10" cols="80">
                This is my textarea to be replaced with CKEditor.
            </textarea>
            <script>
                // Replace the <textarea id="editor1"> with a CKEditor
                // instance, using default configuration.
                CKEDITOR.replace( 'editor1' );
            </script>
        </form>
    </body>
</html>
    
12.10.2015 / 03:31