below is my Controller class.
#Controller
public class BankController {
#Autowired
private CustomerService customerService;
#Autowired
private CustomerRepository customerRepository;
#RequestMapping(value="/login", method=RequestMethod.POST)
public String actionLogin(#RequestParam String email, #RequestParam String password, Model model){
List<Customer> byEmail = customerRepository.findByEmail(email);
Customer customer = byEmail.get(0);
if(BCrypt.checkpw(password, customer.getHashedPassword())){
model.addAttribute("customer", customer);
return "enterSiteView.html";
}
return "errorView.html";
}
I have kept enterSiteView.html, errorView.html in templates folder as given in the documentation.
When I click the login button the url does change to http://localhost:9090/enterSiteView.html but it displays an error as.
Whitelabel Error Page
application has no explicit mapping for /error, so you are seeing this as a fallback.
Sun Oct 23 14:03:43 IST 2016
There was an unexpected error (type=Not Found, status=404).
No message available`
My enterSiteView.html has nothing but just a Hello World text.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hello Earth</title>
</head>
<body>
</body>
</html>
Login Page:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Sign-Up/Login Form</title>
<link href='http://fonts.googleapis.com/css?family=Titillium+Web:400,300,600' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="form">
<ul class="tab-group">
<li class="tab active">Sign Up</li>
<li class="tab">Log In</li>
</ul>
<div class="tab-content">
<div id="signup">
<h1>Sign Up for Free</h1>
<form action="/register" method="post">
<div class="top-row">
<div class="field-wrap">
<label>
First Name<span class="req">*</span>
</label>
<input type="text" required autocomplete="off"/>
</div>
<div class="field-wrap">
<label>
Last Name<span class="req">*</span>
</label>
<input type="text" required autocomplete="off"/>
</div>
</div>
<div class="field-wrap">
<label>
Email Address<span class="req">*</span>
</label>
<input type="email" required autocomplete="on"/>
</div>
<div class="field-wrap">
<label>
Set A Password<span class="req">*</span>
</label>
<input type="password" required autocomplete="off"/>
</div>
<button type="submit" class="button button-block"/>Get Started</button>
</form>
</div>
<div id="login">
<h1>Welcome Back!</h1>
<form action="/login" method="post">
<div class="field-wrap">
<label>
Email Address<span class="req">*</span>
</label>
<input type="email" id="email" name="email" required autocomplete="off"/>
</div>
<div class="field-wrap">
<label>
Password<span class="req">*</span>
</label>
<input type="password" id="password" name="password" required autocomplete="off"/>
</div>
<p class="forgot">Forgot Password?</p>
<button class="button button-block"/>
Log In</button>
</form>
</div>
</div><!-- tab-content -->
</div> <!-- /form -->
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src="js/index.js"></script>
</body>
</html>
I have places index.html in static for the welcomepage. After the login is successful it should redirect to the desired page, instead it shows the above error.
We have common path scheme of java web application:
[host]:[port]/MyWebApplication/personal/info/top.html
where:
MyWebApplication is context path (in microservices application mapped
to root by default)
personal - is a servlet path
info/top.html is a path info
requestURI = contextPath + servletPath + pathInfo
So you redirecting base on relative path, it means that if you: specify this way :
return "redirect: errorView.html"
it directs you
(requestURI - last path part) + errorView.html
if you came from http://example.com/user/path/to/info.html , you redirect to http://example.com/user/path/to/errorView, but if you came from http://example.com/user , you redirect to http://example.com/errorView.html. So changes only last request path part.
When you use :
return "redirect: /errorView.html"
it directs you
context path + new servlet path(/errorView.html)
if you came from http://example.com/user/path/to/info , you redirect to http://example.com/errorView.html. Doesn't matter how long request path is.
Upd: if you take a look at this excellent post, you never face problem with relative path again
Related
I'm new to coding just learning HTML and CSS so there is probably a simple solution I cannot see.
I have written HTML code and linked it to my CSS file in Visual Studio Code. I have test the link in the editor and it worked and I have also checked my class tags.
The weird thing is the CSS is displayed in browser if I run it in Code Pen with no problems however this is not the case in VSC.
Any ideas would be really helpful,
Following is my code blocks,
HTML
<!DOCTYPE html>
<html>
<head>
<title> Designer Form </title>
<meta charset=”utf-8”>
<link type="stylesheet" href="designerform.css">
</head>
<center> <h1>Fill out this form</h1> </center>
<body>
<form class = "all">
<!--Input for a text box-->
<form1>
<h2> 1.</h2>
<label for="Name">Name </label>
<input id="Name" type="text" name="Name">
</form1>
<!--Input for a number -->
<form2>
<h3> 2. </h2>
<label for="Age"> Age </label>
<input id="Age" type="number" name="Age">
</form2>
<!--Input for telephone-->
<form3>
<h4> 3. </h4>
<label for="telephone">Telephone</label>
<input id="telephone" type="tel" name="Telephone">
</form3>
<!--Input for email-->
<form4>
<h5> 4. </h5>
<label for="email"> Email:</label >
<input id="email" type="email" name= "Email">
</form4>
<!--Input for calender-->
<form5>
<h6> 5. </h6>
<label for="calender"> Calender</label>
<input id="calender" type="month" name= calender>
</form5>
<!-- Input for search -->
<form6>
<h7> 6. </h7>
<label for="search">search</label>
<input id="search" type="search" name="search">
</form6>
<!--Text area for longer form responses-->
<form7>
<h8> 7. </h8>
<label for="long response"> Tell me more...</label>
<textarea id="long response" name= "long response"></textarea>
</form7>
<!--Predertimed responses-->
<form8>
<h9> 8. </h9>
<label for= "Fav colours"> What is your colour?</label>
<select id= "Fav colours">
<option value="colorRed"> Red</option>
<option value="colorBlue"> Blue</option>
<option value="colorYellow"> Yellow</option>
</select>
</form8>
<!--Radio inputs-->
<input type ="submit" value="Finish">
</form>
</body>
</html>
and CSS
.all {background-color: rgb(238, 129, 238);
font-family: fantasy; }
h1 {text-align: center;
color: #FFF;
background-color: rgb(102, 155, 204); }
Thanks in advance for your time.
the problem is with your link tag stylesheet should be rel not type.
yours <link type="stylesheet" href="designerform.css">
and should be like this <link rel="stylesheet" href="designerform.css">
You have a typo in your css link. Should be rel="stylesheet", not type;
<link rel="stylesheet" href="designerform.css">
Check out the following link for proper css linkage - How to add CSS
can i get all this information without any php code or script on an other web form?can i get all this information without any php code or script on an other web form?can i get all this information without any php code or script on an other web form?can i get all this information without any php code or script on an other web form?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>My Web From</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="main.css" />
<script src="main.js"></script>
</head>
<body>
<form action="" method="POST">
<ul style="list-style-type:none;">
<a name="top">
<fieldset>
<legend>
<h3>Basic Infromation</h3>
</legend>
<li> Image
<input type="image" name="image">
</li>
<br>
<li>
<input type="button" name="btnUploadImage">
</li>
<br> First Name:
<input type "text" name="firstName" size="30" maxlength="25">
<span>
Last Name:
<input type "text" name="lastname" size="30" maxlength="25">
</span>
</li>
<br>
<li>
<br>CNIC:
<input type="number" name="cnic" size="30" maxlength="25">
</li>
<br>
<li> Date Of Birth:
<input type="date" name="dateOfBirth" size="30" maxlength="25">
</li>
<br>
<li> Email:
<input type="email" name="email" size="30" maxlength="25">
</li>
<br>
<li>Address:
<textarea rows=”10” cols=”40” name=”address”> </textarea>
</li>
<br>
<br> Gender:
<input type="radio" name="gender" value="male" checked> Male |
<input type="radio" name="gender" value="female"> Female |
<input type="radio" name="gender" value="other"> Other
<li></li>
<br>
<input type="submit" value="Submit">
</fieldset>
</ul>
</form>
Back to top
</body>
</html>
Unfortunately, your question is not very clear.
I assume that you want the input data of the form above to be displayed in another form on a different page, when the submit button is clicked.
If so, yes, you can get this information there using JavaScript.
What you would have to do to get there:
Send form data via URL parameters (so something like targetpage.html/?lastname=John&cnic=4545and so on
On the target page you'd have to implement JavaScript which gets those URL parameters (probably call them by name and store them in a variable to use them)
Use the single parameters to populate the input of your form on this page or do whatever you want with it.
This has of course downsides. E.g. JavaScript could be disabled or manipulated, so you should be careful.
I am developing a web app with Swift 4 and Vapor 2.0. I have a method for a POST request which creates a new user:
builder.post("user", "createUser") { (request) -> ResponseRepresentable in
But I don't know how to add action for button in the .leaf file to call the createUser method. It easy to add a JavaScript action in a .html file, like that <script src="js/index.js"></script>. But with Vapor, I didn't see any mention about that in the Vapor 2.0 docs
Update:
With help from #Caleb Kleveter, now it worked. I updated html page(it's just for test, so that it's not a nice page) with hope: it'll help for newcomer whom face with the same problem when use vapor.
Here is my HTML contents:
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>Responsive Login Form</title>
<link rel='stylesheet prefetch' href='http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css'>
<link rel="stylesheet" href="styles/app.css">
</head>
<body>
<link href='https://fonts.googleapis.com/css?family=Ubuntu:500' rel='stylesheet' type='text/css'>
<h3>
<form action="/user/createUser" method="POST" class="login-form">
<label for="username">Username:</label>
<input type="text" placeholder="Username" name="username"/>
<label for="password">Password:</label>
<input type="password" placeholder="Password" name="password"/>
<input type="submit" value="Login" class="login-button"/>
<form>
</h3>
<a class="sign-up">Sign Up!</a>
<br>
<h6 class="no-access">Can't access your account?</h6>
</div>
</div>
<!-- <div class="error-page">
<div class="try-again">Error: Try again?</div>
</div> -->
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js'></script>
<script src="js/index.js"></script>
</body>
</html>
Scripts can be added to a .leaf file the same way as you would in HTML, just add a script tag:
<script src="js/index.js"></script>
From viewing your code, what you want is a form to post the data to the server. You should replace your .login-form div with a form element:
<form action="/create-user" method="POST" class="login-form">
<label for="username">Username:</label>
<input type="text" placeholder="Username" name="username"/>
<label for="password">Password:</label>
<input type="password" placeholder="Password" name="password"/>
<input type="submit" value="Login" class="login-button"/>
<form>
<a class="sign-up">Sign Up!</a>
<h6 class="no-access">Can't access your account?</h6>
Here is the documentation for HTML forms.
Then you should be able to access the form data in you route method with request.body:
func createUser(req: Request) throws -> ResponseRepresentable {
guard let password = req.body["password"]?.string,
let username = req.body["username"]?.string else {
throw Abort.badRequest
}
// The rest of your code goes here
}
I am not sure if this will work, I haven't tested it, but I think you get the idea.
I am hosting a website on GitHub pages, and when I try to submit a formspree.io form I get the following error:
Here is my code:
<form action="http://formspree.io/example#example.com" method="post">
<div class="row uniform collapse-at-2">
<div class="6u">
<input type="text" name="_replyto" placeholder="Email">
</div>
</div>
<div class="12u">
<textarea name="Message" placeholder="Message..." rows="4" cols="50" maxlength="500"></textarea>
</div>
<br>
<div style="display:none">
<input type="hidden" name="_subject" value="New submission!">
<input type="hidden" name="_next" value="thanks.html">
<input type="text" name="_gotcha">
</div>
<div class="row uniform">
<div class="12u">
<ul class="actions">
<li>
<input type="submit" class="special" value="Send">
</li>
</ul>
</div>
</div>
</form>
Would this be due to a code error, GitHub pages error, or a formspree error?
Things you should do to make it work are as follows:
According to formspree example:
<form method="POST" action="http://formspree.io/YOUREMAILHERE">
<input type="email" name="email" placeholder="Your email">
<br>
<textarea name="message" placeholder="Your message"></textarea>
<button type="submit">Send</button>
</form>
Here put your email in "http://formspree.io/YOUREMAILHERE" after /. And if you want change name="email" to name="_replyto" this will change the senders email to a clickable link.(Helps while reading in mail)
If that also doesn't work and it shows that "you must use server. Formspree will not work in pages browsed as HTML pages."
Then inside your <head> tag put:
<meta name="referrer" content="origin">
Hope it works!!
All the best :)
I had the exact same problem - add the following to your field:
<meta name="referrer" content="origin" />
This worked from me.
I'm getting 2 errors:
end tag for "FORM" omitted, but its declaration does not permit this:
and
end tag for element "FORM" which is not open:
but I thought I closed both of them properly.
html :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title> Incident Form </title>
<link rel="stylesheet" href="http:...">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div class="header">
Incident Form
</div>
<div class="t1">
<form action="connect_database.php" method = post>
<p>
<br><br>
<ins>Be sure to fill in all of the fields</ins>
<br><br><br><br>
</p>
<p>
Choose the type of incident<br>
<br>
</p>
<p>
<input type="radio" name="type" value="afs"> Afs<br>
<input type="radio" name="type" value="db"> Database<br>
<input type="radio" name="type" value="cs"> Computer systems<br>
<input type="radio" name="type" value="pw"> Password<br>
<input type="radio" name="type" value="hw"> Hardware<br>
<input type="radio" name="type" value="other"> Other<br>
<br><br><br>
</p>
<p>
Describe the incident<br><br>
<textarea rows="6" cols="20" name="inc"></textarea><br><br>
</p>
<p>
Would you also like to receive an email copy of your form summary?
<br><br>
</p>
<p>
<input type="radio" name="yesno" value="yes"> Yes<br>
<input type="radio" name="yesno" value="no"> No<br>
<br><br>
<input type="submit" name = "submit1" value= "Submit Incident">
</p>
</div>
</form>
</body>
</html>
Just switch your div and form tag.
You're opening the div:
<div class="t1">
then opening the form:
<form action="connect_database.php" method = post>
then closing the div:
</div>
and closing the form:
</form>
Instead the correct order is open the div, open the form, closing the form, closing the div.
Tags are contained in each others like in a Matryoshka doll.
You have wrong nestings of your outer div (class="t1") and form. It should be like this at the end:
</form>
</div>
</body>
and not:
</div>
</form>
</body>
because the div tag is opened before the form.
You're closing the last <div> in the wrong place. Move it bellow the </form> tag.
Also, try to use and CSS instead of and
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title> Incident Form </title>
<link rel="stylesheet" href="http:...">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div class="header">
Incident Form
</div>
<div class="t1">
<form action="connect_database.php" method = post>
<p>
<br><br>
<ins>Be sure to fill in all of the fields</ins>
<br><br><br><br>
</p>
<p>
Choose the type of incident<br>
<br>
</p>
<p>
<input type="radio" name="type" value="afs"> Afs<br>
<input type="radio" name="type" value="db"> Database<br>
<input type="radio" name="type" value="cs"> Computer systems<br>
<input type="radio" name="type" value="pw"> Password<br>
<input type="radio" name="type" value="hw"> Hardware<br>
<input type="radio" name="type" value="other"> Other<br>
<br><br><br>
</p>
<p>
Describe the incident<br><br>
<textarea rows="6" cols="20" name="inc"></textarea><br><br>
</p>
<p>
Would you also like to receive an email copy of your form summary?
<br><br>
</p>
<p>
<input type="radio" name="yesno" value="yes"> Yes<br>
<input type="radio" name="yesno" value="no"> No<br>
<br><br>
<input type="submit" name = "submit1" value= "Submit Incident">
</p>
</form>
</div>
</body>
</html>
i had this kind of bug and couldn't also validate my document... the best way in this case is to put the open form Tag directly after the open ody tag and the closing form Tag directly before the closing body Tag. something like this:
<body>
<form ....>
....
</form>
</body>
And i would use the fieldset, label and legen etc. Adding structure to forms: the FIELDSET and LEGEND elements
Amin Kasbi