I am creating a login form for my java app. But I can't get it to submit. I can't find any errors in my form.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Log in</title>
</head>
<body>
<div id="container">
<div id="top">
<h1>Please complete the form below</h1>
</div>
<div id="leftSide">
<fieldset>
<legend>Login details</legend>
<form action="login.jsp" method="get" class="form">
<label for="username">Username</label>
<div class="div_texbox">
<input name="username" type="text" class="username" id="username" value="username" />
</div>
<label for="password">Password</label>
<div class="div_texbox">
<input name="password" type="password" class="password" id="password" value="password" />
</div>
<div class="button_div">
<input name="submit" type="button" value="Submit" class="buttons" />
</div>
</form>
</fieldset>
</div>
</div>
</body>
</html>
There are some from other parts of page.
change this:
<input name="submit" type="button" value="Submit" class="buttons" />
to this:
<input name="submit" type="submit" value="Submit" class="buttons" />
Submit button type should be submit.
change the input type from button to Submit in this line and you should be able to submit
<input name="submit" type="button" value="Submit" class="buttons" />
your code is normal, if you can't submit it take a look to your "login.jsp".
also you can use
<form action="login.jsp" method="post" class="form">
and change:
type="botton"
to
type="submit"
Related
I was doing a form using HTML and i found that when I'm using my submit button it is showing my local C drive
It doesn't submit my form
CODE:
<div class="container">
<form id="form" action="/">
<h1>Registration</h1>
<div class="input-control">
<label for="username">Username</label>
<input id="username" name="username" type="text">
<div class="error"> </div>
</div>
<div class="input-control">
<label for="username">Email</label>
<input id="email" name="username" type="text">
<div class="error"> </div>
</div>
<div class="input-control">
<label for="Message">Message </label>
<input id="Message" name="username" type="text">
<div class="error"> </div>
<button type="submit">Sign up</button>
</form>
In your <form> tag you have used an attribute action='/' which is opened when you click submit button. That is in case of a file the index or your drive default address. If you change it to:
<form id="form" action="#">
it will not redirect to default address.
Here you can use this logic :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<form onsubmit="sub(event)">
<input type="text" name="username" />
<input type="password" name="password" />
<button type="submit">save</button>
</form>
<script>
async function sub(ev) {
// prevents refresh
ev.preventDefault();
console.log(ev.target.username.value);
console.log(ev.target.password.value);
}
</script>
</body>
</html>
Everything was working fine before, but it stopped working after a while. When I press the button to sign up, it opens up a blank page with a blank box, unlike before, when it had the actual stuff it was supposed to have. I have here the images, please help me. Thanks in advance!
enter image description here
<!DOCTYPE html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<title>Winit - Login/Sign Up</title>
<link rel="shortcut icon" href="/assets/favicon.ico">
<link rel="stylesheet" href="./src/main.css">
<link rel="icon" href="https://lh3.googleusercontent.com/proxy/7ytbxkmMme0IPSvsHZN9ZFd19oIZ9lqtq_402Z1UbIr0-1yMU_OoIbwaJsZ3x3ZEoQtZTJ4lR9hHLxSQibKiacHqfNyEEKdNunHv4J9hohCTtNlqO0yfb2rYGQhxl1M"
</head>
<body>
<script
src="https://code.jquery.com/jquery-3.4.1.js"
integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
crossorigin="anonymous"></script>
<script>
function SubForm(){
$.ajax({
url:'https://api.apispreadsheets.com/data/20789/',
type:'post',
data:$("#createAccount").serializeArray(),
success: function(){
alert("Form Data Submitted :)")
},
error: function(){
alert("There was an error :(")
}
});
}
</script>
<div class="container">
<form class="form" id="login">
<h1 class="form__title">Login</h1>
<div class="form__message form__message--error">Incorrect Username/Password Combination</div>
<div class="form__input-group">
<input type="text" class="form__input" autofocus placeholder="Username or email">
<div class="form__input-error-message"></div>
</div>
<div class="form__input-group">
<input type="password" class="form__input" autofocus placeholder="Password">
<div class="form__input-error-message"></div>
</div>
<input type="checkbox" checked="checked" name="remember" style="margin-bottom:15px"> Remember me
<div>
<button class="form__button" type="submit">Continue</button>
<p class="form__text">
Forgot your password?
</p>
<p class="form__text">
<a class="form__link" href="./" id="linkCreateAccount">Don't have an account? Create account</a>
</p>
</form>
<form class="form--hidden" id="createAccount">
<h1 class="form__title">Create Account</h1>
<div class="form__message form__message--error"></div>
<div class="form__input-group">
<input type="text" class="form_input" input name="username" class="form__input" autofocus placeholder="Username">
<div class="form__input-error-message"></div>
</div>
<div class="form__input-group">
<input type="text" class="form__input" input name="email" autofocus placeholder="Email Address">
<div class="form__input-error-message"></div>
</div>
<div class="form__input-group">
<input type="password" class="form__input" input name="password" autofocus placeholder="Password">
<div class="form__input-error-message"></div>
</div>
<div class="form__input-group">
<input type="password" class="form__input" autofocus placeholder="Confirm password">
<div class="form__input-error-message"></div>
</div>
<label>
<button onclick="SubForm()" <button class="form__button" type="submit">Continue</button>
<p class="form__text">
<a class="form__link" href="./" id="linkLogin">Already have an account? Sign in</a>
</p>
</form>
</div>
<script src="./src/main.js"></script>
</body>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./css/styles.css">
<title>Contact Us</title>
</head>
<body>
<form action="MAILTO: xyz#gmail.com" method="post" enctype="text/plain"></form>
<div class="wrapper">
<div class="title">
<h1>contact us form</h1>
</div>
<div class="contact-form">
<div class="input-fields">
<input type="text" class="input" placeholder="Name" required>
<input type="text" class="input" placeholder="Email Address" required>
<input type="text" class="input" placeholder="Phone" required>
<input type="text" class="input" placeholder="Subject" required>
</div>
<div class="msg">
<textarea placeholder="Message"></textarea>
<button type="submit">Send</button>
<!-- <div class="btn">send</div> -->
</div>
</div>
</div>
</form>
</body>
</html>
Hi! I am trying to make a contact form but i am not able to receive the Email send by the form....actually it never sends the data...what can i do? I want to receive the data on my gmail when the user clicks the send Button.
There is a closing tag at the end of the line where you start your form.
<form action="MAILTO: xyz#gmail.com" method="post" enctype="text/plain">
<div class="wrapper">
<div class="title">
<h1>contact us form</h1>
</div>
<div class="contact-form">
<div class="input-fields">
<input type="text" class="input" placeholder="Name" required>
<input type="text" class="input" placeholder="Email Address" required>
<input type="text" class="input" placeholder="Phone" required>
<input type="text" class="input" placeholder="Subject" required>
</div>
<div class="msg">
<textarea placeholder="Message"></textarea>
<button type="submit">Send</button>
<!-- <div class="btn">send</div> -->
</div>
</div>
</div>
</form>
Try the above instead.
On top of this - all this code will do is open a client on your computer for the user to then send an email direct. It won't submit a message direct to the user from the browser. If you wish to do that, you will have to use back-end code. I suggest Node.js and Nodemailer. Here's a good link explaining that:
https://blog.mailtrap.io/nodemailer-gmail/
I am trying to style a contact form I set up on my website. I took a ready made one (html with css styling and php action) but when I put it in my html, it doesn't link the html with the css. How should I define the divs? Thank you.
<div id="contact" class="contact">
<div class="row">
<div class="divider4"></div>
<form action="mail.php" method="post" id="vreme">
<div class="column-1">
YOUR NAME<br/><br/>
<input name="name" id="name" value="" />
</div>
<div class="column-2">
YOUR E-MAIL<br/><br/>
<input name="email" id="email" value="" />
</div>
<div class="column-3">
MESSAGE<br/><br/>
<textarea id="message" name="message" ></textarea>
</div>
<div class="button">
<span><input class="submit" id="submit" name="submit" type="submit" value="Send"></span>
</div>
</form>
</div>
</div>
Have you included the css reference to your page header? As in
<link rel="stylesheet" href="css/form-style.css" type="text/css">
There should be a css file for the given html form in that website. You should connect that form.css file to the form.html post by mentioning the following code in the head section of your html. Check it and see
<html>
<head>
<link rel="stylesheet" href="css/form.css" type="text/css">
</head>
<body>
<div id="contact" class="contact">
<div class="row"><div class="divider4"></div>
<form action="mail.php" method="post" id="vreme">
<div class="column-1">
YOUR NAME<br/><br/>
<input name="name" id="name" value="" />
</div>
<div class="column-2">
YOUR E-MAIL<br/><br/>
<input name="email" id="email" value="" />
</div>
<div class="column-3">
MESSAGE<br/><br/>
<textarea id="message" name="message" ></textarea>
</div>
<div class="button">
<span><input class="submit" id="submit" name="submit" type="submit" value="Send"></span>
</div>
</form>
</div></div>
</body>
</html>
I have included the css reference, the rest of my page styling is working, that isn't. The weird part is, I took that from a website I had previously worked on, and it worked there perfectly.
<link rel="stylesheet" href="assets/style.css" type="text/css">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Form Style</title>
<link type="text/css" rel="stylesheet" href="css/form.css"/> //css/form.css - select your file location
/* OR */
<style type="text/css">
/*Paste your css style code here*/
</style>
</head>
<body>
<div id="contact" class="contact">
<div class="row">
<div class="divider4"></div>
<form name="mail" action="mail.php" method="post" id="vreme">
<div class="column-1">
YOUR NAME<br/><br/>
<input name="name" id="name" value="" />
</div>
<div class="column-2">
YOUR E-MAIL<br/><br/>
<input name="email" id="email" value="" />
</div>
<div class="column-3">
MESSAGE<br/><br/>
<textarea id="message" name="message" ></textarea>
</div>
<div class="button">
<span><input class="submit" id="submit" name="submit" type="submit" value="Send"></span>
</div>
</form>
</div>
</div>
</body>
</html>
Hope this helps...
<html>
<body>
<link rel="stylesheet" type="text/css" href="css.css"
<form action="RegnDisplay.php" method="post" class="registration_form">
<fieldset>
<legend>Registration Form </legend>
<p>Personal Information </p>
<div class="elements">
<label for="name">Name :</label>
<input type="text" id="name" name="name" size="25" />
</div>
<div class="elements">
<label for="e-mail">E-mail :</label>
<input type="text" id="e-mail" name="e-mail" size="25" />
</div>
<p>Security Information </p>
<div class="elements">
<label for="Password">Password:</label>
<input type="password" id="Password" name="Password" size="25" />
</div>
<div class="elements">
<label for="Password">Confirm Password:</label>
<input type="password" id="Password_Confirm" name="Password_Confirm" size="25" />
</div>
<div class="submit">
<input type="hidden" name="formsubmitted" value="TRUE" />
<input type="submit" value="Register" />
</div>
</fieldset>
</form>
</body>
</html>
This is a basic form, trying to post user submitted values to a processing page, however my page is just blinking and not performing the action. Any help would be appreciated.
On line 3:
<link rel="stylesheet" type="text/css" href="css.css"
Should be:
<link rel="stylesheet" type="text/css" href="css.css"/>