Form is not appearing but its content does

This just happened to me using Chrome -- it was because I had a form within a form. It looks like Chrome just stripped out the <form> open and close tag because my form was within another form. When I moved one form outside of the other, then both <form> tags were rendered in the html as intended.
Crackermann was getting at this in his answer too.

It's hard to give a direct solution without seeing your full html, but I'm guessing this is your problem - you need to make sure your form is not within another form. Really simple example to illustrate this:

Form within another form, notice if you run this code in Chrome and inspect <form id="form2"> is not rendered:

<html>
<head></head>
<body>
	<form id="form1">
		<div>form within a form</div>
		<form id="form2">
			<input type="text" placeholder="name" /><br/>
			<input type="text" placeholder="title" />
		</form>
	</form>
</body>
</html>

If you move form2 outside of form1, run the code in Chrome and inspect, then <form id="form2"> is rendered:

<html>
<head></head>
<body>
	<form id="form1">
		<div>form2 moved outside of form1</div>
	</form>
	
	<form id="form2">
		<input type="text" placeholder="name" /><br/>
		<input type="text" placeholder="title" />
	</form>
</body>
</html>

well then somehow there was a weird problem with the forms, the button didn't show up because when i ran the website the the 'profileForm' just disappeared somehow (and didn't show up in the console). what i did was adding a third Form before 'profileForm' which somehow solved this.


There is an unclosed HTML TAG like < form > in your code before these lines ,

Find and close that form

OR

just put </form> before your code.