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.