1

I'm trying to use Quill.js - Your Powerful Rich Text Editor for my project in laravel.

But, since quill uses:

<div id="editor"></div> || <div id="editor" name="body"></div>

Instead of a regular old:

<textarea id="editor" name="body"></textarea>

$post->body = $request->input('body'); won't work.

What do I use to save the information I get from a div with the id of #editor into a database.

The_Outsider
  • 1,875
  • 2
  • 24
  • 42
blaze-rowland
  • 117
  • 1
  • 4
  • 11

2 Answers2

3

Use the following in JavaScript:

var content = document.querySelector("#editor").innerHTML

Then append that to your form input before its submitted.

You can also get it directly from the quill instance via:

quill.root.innerHTML
2

Add a hidden input :

<input type="hidden" name="body"/>

Js code :

var form = document.getElementById("FormId"); // get form by ID

form.onsubmit = function() { // onsubmit do this first
                             var name = document.querySelector('input[name=body]'); // set name input var
                             name.value = JSON.stringify(quill.getContents()); // populate name input with quill data
                             return true; // submit form
                           }

To set contents to quill do this :

quill.setContents({!! $post->body !!});
iHabboush
  • 537
  • 4
  • 8