I've an async function to validate the input of a form. If everything is correct then the form should be submitted.

I've tried the following code where my goal is to call the async function and once it's completed I execute the "then" part where, depending on the result of the async function classify, I want to complete the form submission.

Everything works well (the interception of the original submit event, the call to the async function, the evaluation of the comment text,..) except for the actual code to commentForm.submit(); where I get an Uncaught (in promise) TypeError: commentForm.submit is not a function error

I guess there is something very obvious I'm missing but I'm blocked at this point.

<script>
           window.onload=function() {
               var commentForm = document.getElementById('commentform');
               commentForm.addEventListener('submit', function(event){

                  async function classify(input) {
                       // checks, for simplificity let's assume we just return false
                       return false;
                  }

                   event.preventDefault();
                   const textComment = document.getElementById('comment').value;
                   classify([textComment]).then(result => {
                       if (result) {
                          alert('Your comment has been flagged and cannot be submitted');
                       }
                       else  {
                           alert('Good to go');
                           commentForm.submit();

                       }
                   })
                })

           }
        </script>

0 Answers