Plain HTML form not showing up in dashboard

Support
1

Hi all,

I’m in the middle of trying to implement blog comments according to https://jamstack-comments.netlify.com.

Unfortunately, the form I created doesn’t show up in my site’s dashboard.

It’s a simple HTML form without any fancy JS/AJAX/…, see for yourselves:

<form name="blog-comments" class="w-full flex flex-col mb-8" action="/comment-thanks" method="POST" netlify>
  <input name="path" type="hidden" value="{{ .RelPermalink }}">
   <label class="hidden">This is the most important field: <input name="best-field"></label>
   <textarea class="border border-solid border-teal bg-grey-light p-2 mb-4" name="Message" rows="6" placeholder="Comment*" style="resize:none;" required></textarea>
   <div class="flex flex-col md:flex-row justify-between items-center">
      <input class="w-full md:w-1/3 p-2 m-0 mb-4 md:mr-3 border border-solid border-teal bg-grey-light" type="text" name="Name" placeholder="Name*" required>
      <input class="w-full md:w-1/3 p-2 m-0 mb-4 md:mx-3 border border-solid border-teal bg-grey-light" type="email" name="Email address" placeholder="E-Mail Address*" required>
      <input class="w-full md:w-1/3 p-2 m-0 mb-4 md:ml-3 border border-solid border-teal bg-grey-light" type="text" name="Website" placeholder="Website">
   </div>
   <button type="submit" class="btn-zoom font-heading text-navy text-3xl uppercase hover:opacity-75 mx-auto">Submit comment!</button>
</form>

Live version in the bottom of this page, seems to render without issues: https://shrwip.netlify.com/blog/the-font-book/index.html

Using data-netlify="true" dind’t do anything; I also tried the hidden input form-name in there (intended for JS rendered forms I believe), but that didn’t make any difference either.

Last thing I did was to remove the spam protection/hidden input in order to check if that’s the cause, but it all stayed the same.

Any more ideas greatly appreciated.

PS: there’s 3 more forms on that same site, none of them relevant for and/or equipped with the netlify attribute so I figure they shouldn’t be causing issues, right?

2

I tried to get some more info on this issue, here’s what I tried:

  1. place the same form on another page with no other forms/multiple occurences. Result: Netlify found the form and added it to the dashboard
  2. give all forms unique names and add data-netlify="false". Result: Netlify found some of the other forms (2 out of 4) and added them to the dashboard
  3. strip the form of all fields/spam protection and keep just one textarea. Result: no change, form still not showing up.

Running out of ideas here, can’t find an explanation as to why Netlify can discover a newsletter signup form that appears many times across the whole website seemingly without any issues, yet a blog comment form won’t show up.

3

Ok, so I finally figured it out:

The reason for the form not being discovered was a parameter called canonifyUrls in the config.toml of my Hugo site.
This lead to the form’s action being re-written to something like https://sitename.netlify.com/thanks which was - evidently - conflicting with the requirement of the action attribute being a relative URL starting with a /.

Hope it helps anyone encountering the same issue.

4

thanks for continuing to work on this! This is really helpful for other users!