Autosave the text in tinymce with AJAX

Question

I want to autosave my text in tiny mce with a post to my controller. I want only autosave the name="inhoud2" of the textarea.

Here is my header:

@extends('dashboard.app')

@section('content')

@include('auth.flashMessageError')
<script src="\tinymce_4.4.1\tinymce\js\tinymce\tinymce.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>tinymce.init({ selector: 'textarea',  height : 350, }); </script>
<script>tinymce.init({ selector:'textarea' });</script>
<script>
var autosaveOn = false;
function myAutosavedTextbox_onTextChanged()
{
    if (!autosaveOn)
    {
        autosaveOn = true;

        $('#inhoud2').everyTime("300000", function(){
             $.ajax({
                 type: "POST",
                 url: "opslaanedit",
                  data: $("#editsubmit").serialize(),
                 success: function(msg) {
                     $('autosave').text("gesaved");
                 }
             });
        }); //closing tag
    }
}

</script>

This is my html code:

<form method="POST" id="editsubmit" action="/opslaanedit" >

    {!! csrf_field() !!}

        <div id="autosave"></div>
    <div class="panel panel-flat">
        <div class="panel-heading">
            <h5 class="panel-title">Wijzig Document</h5>
            <div class="heading-elements">

            </div>
        </div>

        <div class="panel-body">
            <fieldset>
                <legend class="text-semibold">Wijzig de inhoud</legend>

                <div class="form-group">
                    <input type="hidden" value="{{basename($root)}}" name="filename" id="filename" readonly="readonly" class="form-control" > <!-- verborgen veld voor de html name -->

                    <label><b>Titel</b> </label>
                    <input type="text" value="{{$title}}" id="titelnieuw" name="titelnieuw" class="form-control">

                </div>
                <textarea id="inhoud2" name="inhoud2"><?php echo file_get_contents($root);?></textarea> <!--tiny mce editor -->
                <br>
                <div class="text-left">
                    <button type="submit" class="btn btn-primary">Wijzig <i class="icon-arrow-right14 position-right"></i></button>
                </div>
            </div>
        </div>
    </form>

    @endsection

I doesn't save my text automatically.

Answer 1

This looks like inherited code. There's lot of space for improvement. I don't know if textarea is saved for the first time, or just updated, so I cant figure to which route should I post value of textarea. Are there any other fields required for that?

There are many factors. And if you only afraid of losing textarea content, I would use just autosave plugin from tinymce. It keeps content in local storage.