Как сохранить данные при текстовых щелкните вне текстового поля с помощью AJAX

Question

Я использую редактор froala и хочу, чтобы текст в текстовой области редактора сохранялся, когда пользователь щелкает вне этой области текста с помощью Ajax. Я новичок в редакторе контента ajax: #id_content

Это часть формыв Django

<form method="POST" id="froala_form" class="PageForm _inputHolder">
    {% csrf_token %}
    <div class="_alignRight posR _saveBTNOut">
      <button type="submit" class="_btn btnPrimery">Save as Draft</button>
    </div>
</form>

Это то, что я пытался, но не получил никакой правильной логики

   function loadDoc(){
      var xhttp=new XMLHttpRequest();
      xhttp.onreadystatechange=function{
        if(this.readyState==4 && this.status==200){
          var x = document.getElementById("id_content");
          x.addEventListener("click", ajaxsavefunc);
        }
      };
      xhttp.open("GET",'url', true);
      xhttp.send();
    }

    function ajaxsavefunc(xhttp) {
     document.getElementById("froala_form").innerHTML = editor.html.get()
   }

Answer 1

Это пример того, как использовать размытие (когда пользователь нажимает за пределами поля) в Jquery.

По сути, этот пример вернет предупреждение со значением ввода, когда пользователь щелкает поле и щелкает вне поля.

<form method="post" action="" >
   <input type="text" id="test" value="123">
   <input type="submit">
</form>

$(function () {
  $('#test').blur(function (e) {
    e.preventDefault();
    var x = document.getElementById("test").value;
    var saveData = $.ajax({
      type: 'POST',
      url: "someaction.do?action=saveData",
      data: {input: x},
      dataType: "text",
      success: function(resultData) { alert("Save Complete") }
    });
  });
});