Multiple forms on 1 page

HTML & CSS
1

I have this form on a page

image
image512×372 22.8 KB

<dialog loginmodal>
<a class="close" closeloginmodal>&times;</a>
<h2>Login</h2>
<hr>
	<form method="POST">
		<div class="form-group mb-3">
			<label for="Email">Email</label>
			<div class="input-group">
				<div class="input-group-prepend">
					<span class="input-group-text">@</span>
				</div> 
				<input type="email" class="form-control" id="Email" name="email" required>
			</div>
		</div>
		<div class="form-group mb-3">
			<label for="Password">Password</label>
			<input type="password" class="form-control" id="Password" name="password" required>					
		</div>
		<div class="form-row">
			<div class="col">
				<div class="d-grid">
					<button class="btn btn-primary" type="submit"><span class="icon-ok"></span>&nbsp;&nbsp;Submit</button>
				</div>
			</div>
		</div>
	<input type="hidden" name="type" value="login">
	</form>
<h6 class="text-end"><button openforgotmodal class="btn btn-link">Forgot Password</button></h6>
</dialog>

But when I submit it I get

image
image1022×142 8.21 KB

why is the form being submited to that page (shouldn’t it be submitted to the current page)
I have another form on the page,


  <form action="sites/add_site_engine.php" method="POST" enctype="multipart/form-data">

Can I make the form submit to the current page instead?

2

Your snippets of code doesn’t tell us what’s wrong with the code for the whole page. Best guess is your makeup is invalid (nested forms). Are you validating your web pages at validator.w3.org ?

3

As there is a rather severe case of divitis there, I thought I would have a go at eliminating all <div> elements:

1 Like
4

how did you do the red x and check in the button?

image
image173×208 3.89 KB

5

I simply did a copy-and-paste of each UTF-8 character from a web page such as this:
https://www.w3schools.com/charsets/ref_utf_dingbats.asp.

:check_mark: :cross_mark: :cross_mark_button: :red_question_mark: :sparkles: :pig_face:

I’ve found you don’t seem to need to use an HTML entity (e.g. &times), a decimal reference (eg. &#10060;) or hexadecimal reference (e.g. &#x274C;). I guess that is because I was pasting into CodePen which has UTF-8 character set and not into a very basic ASCII text editor. However, I am not sure whether the characters then display correctly in every browser.