如何存储DIV值？ （鹅毛笔）

Question

问题： 当我向DIV（Quill TextEditor）添加文本并点击“保存”按钮时，我注意到文本未保存在数据库中。 DIV应该保存我的Model的Description属性的值。

我该如何解决这个问题？

查看：

<div class="form-group">
    <label asp-for="Description" class="control-label"></label>
    <div id="editor-container" asp-for="Description" class="form-control"></div>
    <span asp-validation-for="Description" class="text-danger"></span>
    <script>
        var quill = new Quill('#editor-container', {
            modules: {
                toolbar: [
                    [{ header: [1, 2, false] }],
                    ['bold', 'italic', 'underline'],
                    ['image', 'code-block']
                ]
            },
            placeholder: 'Compose an epic...',
            theme: 'snow'  // or 'bubble'
        });
    </script>
</div>

Answer 1

由于DIV不是输入元素，我添加了一个INPUT元素并使其隐藏type="hidden"。通过JavaScript，当用户点击“提交”按钮时，我使用Quilljs Editor值填充INPUT元素。

这就是我解决它的方法。

<div class="form-group">
    <label asp-for="Description" class="control-label"></label>
    <input asp-for="Description" name="Description" type="hidden" class="form-control" />
    <div id="editor-container" name="editor-container"></div>
    <span asp-validation-for="Description" class="text-danger"></span>
    <script>
        var quill = new Quill('#editor-container', {
            modules: {
                toolbar: [
                    ['bold', 'italic'],
                    ['link', 'blockquote', 'code-block', 'image'],
                    [{ list: 'ordered' }, { list: 'bullet' }]
                ]
            },
            placeholder: 'Compose an epic...',
            theme: 'snow'
        });

        var form = document.querySelector('form');
        form.onsubmit = function () {
            // Populate hidden form on submit
            var description = document.querySelector('input[name=Description]');
            description.value = JSON.stringify(quill.getContents());

            console.log("Submitted", $(form).serialize(), $(form).serializeArray());
        };
    </script>
</div>