'why the from not submit textarea with required

I apply the CKEditor to textarea to my project but the form doesn't submit like I didn't even press the button

though if I remove the required from textarea it does submit but I need to check required

let elements = document.querySelectorAll('.editor')

for (let element of elements) {
  ClassicEditor.create(element, {})
    .then(editor => {
      element.ckEditor = editor;
    })
    .catch(err => {
      console.error(err.stack);
    });
}
<form method="POST" action="../forms/add-services.php">

  <div class="service-fields mb-3">
    <div class="row">
      <div class="col-lg-12">
        <div class="form-group">
          <label class="h6">Title <span class="text-danger">*</span></label>
          <input class="form-control" type="text" name="service_title" id="service_title" required>
        </div>
      </div>
    </div>
  </div>

  <div class="service-fields mb-3">
    <div class="row">
      <div class="col-lg-12">
        <div class="form-group">
          <label class="h6">details <span class="text-danger">*</span></label>
          <textarea name="details" id="editor1" class="editor form-control " required></textarea>
        </div>
      </div>
    </div>
  </div>

  <div class="submit-section d-flex justify-content-between">
    <button class="btn btn-primary submit-btn" type="submit" name="save">Save</button>
  </div>
</form>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source