0

I am trying to save my bootstrap WYSIWYG content by copying the div editor to a hidden textarea, but when i tried to submit it using ajax, i got a error "Submitted URI too large!" when checked i found out the image that i am trying to add was encoded into a base64. how can i get the image URL so i can process it using PHP.

My HTML

 <div id="editor" name="editor" data-target="content">

</div>

<form>
<textarea type="text"  name="content" id="content"></textarea>
<button type="submit" class="btn btn-danger copyeditor">Save</button>


</form>

My jquery and ajax script

<script>

$(".copyeditor").on("click", function() {

       var targetName = $("#editor").attr('data-target');
       $('#'+targetName).val($('#editor').html());


       $.ajax({
  type: "POST",
  url: "data.php",
  data: $('#content').html(),
  success: success,
  dataType: dataType
});


    });

</script>

Here is what i am dealing with.

enter image description here

The goal is to make this

<img style="width: 640px;" src="data:image/jpeg;base64,/9j/4Qv6RXhpZgAATU0AKgAAAAgABwESAAMAAAABAAEAAAEaAAUAAAABAAAAYgEbAAUAAAABAAAAagEoAAMAAAABAAIAAAExAAIAAAAeAAAAcgEyAAIAAAAUAAAAkIdp...............>

Look like this

<img src="/images/blah/blah.jpg.">
KaoriYui
  • 912
  • 1
  • 13
  • 43
  • What's your limit in php.ini file with key "post_max_size" ? Server may directly refuse that request with that reason. – VirCom May 06 '17 at 15:44
  • Its set to post_max_size=550M – KaoriYui May 06 '17 at 15:46
  • Ok, so try to use processData: false, in your ajax call params. And set dataType param to xml or html value. It should helps. – VirCom May 06 '17 at 15:59
  • Tried it, error still the same. – KaoriYui May 06 '17 at 16:04
  • Ok, so after a hour of looking around i decided to use summernote WYSIWYG instead and follow http://stackoverflow.com/questions/27600724/summernote-image-url-instead-of-base64 and use the top answer. – KaoriYui May 06 '17 at 17:16

0 Answers0