2017-06-09 3 views
2

J'ai ce que je pense être un scénario très commun. Je normalement cette forme:Comment puis-je publier le contenu d'un éditeur Quill dans un formulaire?

<form method="post"> 

<textarea name="text"></textarea> 
<input type="submit" value="Save" /> 

</form> 

Puis avec PHP je serais capturer les données du formulaire ($ _POST [ « text »]) et je pouvais l'utiliser dans une autre variable.

Maintenant, je voudrais utiliser Quill afin que les utilisateurs aient un bon éditeur de texte enrichi à la place. Quill semble très bien adapté pour cela et la documentation est très détaillée. Cependant, pour une raison quelconque, je ne peux pas trouver comment je peux "poster" les données au formulaire. Il y a un single sample page qui fait ce que je veux, mais je suis incapable d'implémenter complètement ceci dans mon exemple, et dans le quick start guide ce sujet plutôt fondamental (pour moi) n'est pas discuté, et je ne peux pas le trouver dans la documentation non plus .

Est-ce que Quill est censé être utilisé comme ça? Est-ce que je supervise quelque chose? Y a-t-il une façon recommandée de faire ce travail?

C'est ce que j'ai actuellement:

<!doctype html> 
<html> 
<head> 
<title>Test</title> 
<meta charset="UTF-8" /> 
<link href="https://cdn.quilljs.com/1.0.0/quill.snow.css" rel="stylesheet"> 
</head> 
<body> 
<form method="post"> 


<!-- Create the toolbar container --> 
<div id="toolbar"> 
    <button class="ql-bold">Bold</button> 
    <button class="ql-italic">Italic</button> 
</div> 


<form method="post"> 

<!-- Create the editor container --> 
<div id="editor"> 
    <p>Hello World!</p> 
</div> 

<input type="submit" value="Save" /> 

</form> 

<!-- Include the Quill library --> 
<script src="https://cdn.quilljs.com/1.0.0/quill.js"></script> 

<!-- Initialize Quill editor --> 
<script> 
    var editor = new Quill('#editor', { 
    modules: { toolbar: '#toolbar' }, 
    theme: 'snow' 
    }); 
</script> 
</body> 
</html> 
+0

je continue des recherches sur ce et il semble que Quill n'a pas vraiment fait pour cela (https://github.com/quilljs/quill/issues/774). Il semble vraiment et tristement que Quill n'est pas une bonne solution pour que les utilisateurs tapent du texte riche et enregistrent le HTML dans une base de données. Mais je ne comprends toujours pas complètement pourquoi ou si c'est vraiment le cas, alors si quelqu'un peut faire la lumière sur la situation, faites-le. – user32421

+0

Voici une discussion plus récente (https://github.com/quilljs/quill/issues/1234). La suggestion consiste à enregistrer innerHTML et le tableau deltas. [Pour publier innerHTML voir cette réponse] (https://stackoverflow.com/a/38426793/3585500) mais remplacez var question = advancedEditor.getText() 'par' editor.container.innerHTML'. – ourmandave

Répondre

3

Vous pouvez vérifier la discussion liée à ce sujet https://github.com/quilljs/quill/issues/87

Bien que ce n'est pas une solution idéale:

var myEditor = document.querySelector('#editor') 
var html = myEditor.children[0].innerHTML 
+1

Merci. Pourquoi est-ce si difficile? Quel est le but de Quill si ce genre de chose est si difficile à réaliser? – user32421

+1

Cette réponse semble être assez simple ... +1 –

0

J'ai eu le même problème , donc je viens de remplacer le div avec un textarea et d'inclure l'attribut name à la div.

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

Ce n'est pas idéal puisque les docs utilisent un div, mais cela fonctionne