php - simplemde-markdown-editor not allowing typing

Question

Libray I am using : simplemde-markdown-editor

What I am trying to achieve: A text editor for a blog website

What I have tried :

Inside blade file that extends from the default.blade.php

@extends('layouts.default')
@section('content')
    <div class="flex flex-wrap -mx-3 mb-6">
        <div class="w-full px-3">
            <label class="label">
                    Summary
            </label>
        <p class="text-gray-600 text-xs italic mb-2">This is the text that will appear in the blog index page
        </p>
           <textarea class="input " name="summary" id="summary">{{old('summary') }}</textarea>
        </div>
    </div>

</section>
{{-- Import CSS and JS for SimpleMDE editor --}}

<link rel="stylesheet" href="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.css">
<script src="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"></script>

<script>
    // Initialise editors
    var bodyEditor = new SimpleMDE({ element: document.getElementById("body") });
    var summaryEditor = new SimpleMDE({ element: document.getElementById("summary") });
</script>

 @endsection

ISSUE: text editor is displayed but can not type in it. It looks like a disabled element.

标签： phplaravelmarkdownsimplemde

Answer 1

工作得很好。你在某处禁用它吗？

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/simplemde/1.11.2/simplemde.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/simplemde/1.11.2/simplemde.min.js"></script>

<div class="flex flex-wrap -mx-3 mb-6">
    <div class="w-full px-3">
        <textarea id="summary">{{ old('summary') }}</textarea>
    </div>
</div>

<script>
    let summaryEditor = new SimpleMDE({
        autofocus: true,
        element: document.getElementById("summary"),
        initialValue: "",
        placeholder: "Type here...",
    });
</script>