Why my hyperlink doesn't work as it should be?-CodePudding

I've started learning HTML recently, and I've understood a lot of things so far. The last thing I've learned was about forms. For practising, I've decided that I would like to make a website, which contains a bit of everything. The problem occures here:

<input  type="e-mail" name="email" value="" placeholder="[email protected]">

 <button type="submit">Submit</button>

</a>

Now what I would like to do, as you've already figured, is that if I fill my e-mail address, I would be redirected to the Thank_You.html file.

I've created the file for it already, and it looks like this, and works perfectly fine aswell:

    <a href="../HTML_102/forms.html">

        <button type="submit">Go back</button>


    </a>


</div>

But the problem is, that it doesn't work in the forms.html file, for some reason. It behaves like that it would be a type="reset" button, whereas it should be a type="submit".

I'll also share my codepen links here, so you can take a look.

forms.html https://codepen.io/ngabor9601/pen/ZExaBgV

Thank_You.html https://codepen.io/ngabor9601/pen/YzaEpmW

Thanks in advance! G

CodePudding user response：

Try to make it like so

<form>
  <input type="button" 
    onclick="window.location.href='../HTML_102/forms.html';" value="Back" />
</form>

CodePudding user response：

Okay! So meanwhile I've found the solution, altough I do not really understand why this solved the problem:

<div>
    <input required type="email" 
    name="email" 
    value="[email protected]" 
    placeholder="Enter your e-mail address">
    </div>

<a href="../HTML_102/Thank_You.html">
    <button type="submit">Submit</button>
</a>

So now it works perfectly, but can someone please explain, why did it work only if I input the link outside of the form element?