redirecting to another page in html - php

I am trying to redirect html form page after submission of data to an another html page using meta req method. Is their any other method ro redirect page as the problem with this is that it shows an intermediate page of our php command which i dont want
my html code is
<form method="POST" action="yoga_signup.php">
<div class="row" style=" margin-top:4rem; margin-left:24rem;">
<div class="col-md-6 mx-auto p-0">
<div class="card">
<div class="login-box">
<div class="login-snip"> <input id="tab-1" type="radio" name="tab" class="sign-in" checked><label for="tab-1" class="tab">Login</label> <input id="tab-2" type="radio" name="tab" class="sign-up"><label for="tab-2" class="tab">Sign Up</label>
<div class="login-space">
<div class="login">
<input type="hidden" name="for_page" value="login">
<div class="group"> <label for="user" class="label">Username</label> <input id="user" type="text" class="input" name="username" placeholder="Enter your username" required> </div>
<div class="group"> <label for="pass" class="label">Password</label> <input id="pass" type="password" name="password_1" class="input" data-type="password" placeholder="Enter your password" required> </div>
<div class="group"> <input id="check" type="checkbox" class="check" checked> <label for="check"><span class="icon"></span> Keep me Signed in</label> </div>
<div class="group"> <input type="submit" class="button" value="Sign In"> </div>
<div class="hr"></div>
my php code for the same is
<?php
session_start();
$conn= new mysqli("localhost","root","","yoga");
if($_SERVER["REQUEST_METHOD"]=="POST"){
$TypeOfRequest=$_POST['for_page'];
if($TypeOfRequest=="signup"){
$user=$_POST['username'];
$pass_1=$_POST['password_1'];
$pass_2=$_POST['password_2'];
$mail=$_POST['email'];
if($pass_1===$pass_2){
$val=" INSERT INTO yoga_login(username,password_1,password_2,email) VALUES('$user','$pass_1','$pass_2','$mail')";
if($conn->query($val)===TRUE){
echo "redirecting to login page.<meta http-equiv='refresh' content='1;login.html'>";
}else{
echo "registration unsucessfull";
}
}
if($pass_1!==$pass_2){
echo "please enter the same password";
}
}
mysqli_close($conn);
}
so is their any other method which doesnt shows the intermediate page like this

Just replace:
echo "redirecting to login page.<meta http-equiv='refresh' content='1;login.html'>";
With the PHP redirect:
header('Location: login.html');
exit; // this is normally a good idea

Related

html form validation using php

I have created a html form which has signup as well as login. Firstly I want to register the user using signup form and then make him login then redirect to another page. For this I'm using php with apache(xampp) server. The signup panel is working fine, but when I try to login, black column is added to database
My html code is like this
<form method="POST" action="yoga_signup.php">
<div class="row" style=" margin-top:4rem; margin-left:24rem;">
<div class="col-md-6 mx-auto p-0">
<div class="card">
<div class="login-box">
<div class="login-snip"> <input id="tab-1" type="radio" name="tab" class="sign-in" checked><label for="tab-1" class="tab">Login</label> <input id="tab-2" type="radio" name="tab" class="sign-up"><label for="tab-2" class="tab">Sign Up</label>
<div class="login-space">
<div class="login">
<input type="hidden" name="for_page" value="login">
<div class="group"> <label for="user" class="label">Username</label> <input id="user" type="text" class="input" name="username" placeholder="Enter your username" > </div>
<div class="group"> <label for="pass" class="label">Password</label> <input id="pass" type="password" name="password_1" class="input" data-type="password" placeholder="Enter your password" > </div>
<div class="group"> <input id="check" type="checkbox" class="check" checked> <label for="check"><span class="icon"></span> Keep me Signed in</label> </div>
<div class="group"> <input type="submit" class="button" value="Sign In"> </div>
<div class="hr"></div>
</div>
<div class="sign-up-form">
<input type="hidden" name="for_page" value="signup">
<div class="group"> <label for="user" class="label">Username</label> <input id="user" type="text" name="username" class="input" placeholder="Create your Username"> </div>
<div class="group"> <label for="pass" class="label">Password</label> <input id="pass" type="password" name="password_1" class="input" data-type="password" placeholder="Create your password" > </div>
<div class="group"> <label for="pass" class="label">Repeat Password</label> <input id="pass" type="password" name="password_2" class="input" data-type="password" placeholder="Repeat your password"> </div>
<div class="group"> <label for="pass" class="label">Email Address</label> <input id="pass" type="text" class="input" name="email" placeholder="Enter your email address" > </div><br>
<div class="group"> <input type="submit" class="button" value="Sign Up"> </div>
<div class="hr"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
and my php code is this
<?php
session_start();
$conn= new mysqli("localhost","root","","yoga");
if($_SERVER["REQUEST_METHOD"]=="POST"){
$TypeOfRequest=$_POST['for_page'];
if($TypeOfRequest=="signup"){
$user=$_POST['username'];
$pass_1=$_POST['password_1'];
$pass_2=$_POST['password_2'];
$mail=$_POST['email'];
if($pass_1===$pass_2){
$val=" INSERT INTO yoga_login(username,password_1,password_2,email) VALUES('$user','$pass_1','$pass_2','$mail')";
if($conn->query($val)===TRUE){
header('Location: login.html');
}else{
echo "registration unsucessfull";
}
}
if($pass_1!==$pass_2){
echo "please enter the same password";
}
}
$TypeofRequest = $_POST['for_page'];
if($TypeofRequest=="login"){
$user=$_POST['username'];
$pass_1=$_POST['password_1'];
$sql="SELECT * FROM yoga_login WHERE username='$user' AND password='$pass_1'";
$RunQuery = mysqli_query($conn,$sql);
$CheckNumberOfUsers = mysqli_num_rows($RunQuery);
//echo $CheckNumberOfUsers;
if($CheckNumberOfUsers==1){
$_SESSION['username'] = $user;
header('location:blogs.html');
}else{
echo "invalid credential";
}
}
mysqli_close($conn);
}
You can dump out what you are sending in the yoga_signup.php at the start of the file:
die('<pre>' . print_r($_POST, true) . '</pre>');
Then you can see this:
Array
(
[tab] => on
[for_page] => signup
[username] =>
[password_1] =>
[password_2] =>
[email] =>
)
so the for_page field's value is signup - and I was pressing the Sign In button
Then you go back to the HTML file and you can see that you are using the same form for the request, so with the second <input type="hidden" name="for_page" value="signup">, you are overwriting the first for_page value.
So instead of this you should create 2 forms and set them like this:
<div class="row" style=" margin-top:4rem; margin-left:24rem;">
<div class="col-md-6 mx-auto p-0">
<div class="card">
<div class="login-box">
<div class="login-snip">
<input id="tab-1" type="radio" name="tab" class="sign-in" checked>
<label for="tab-1" class="tab">Login</label>
<input id="tab-2" type="radio" name="tab" class="sign-up">
<label for="tab-2" class="tab">Sign Up</label>
<div class="login-space">
<form method="POST" action="yoga_signup.php">
<div class="login">
<input type="hidden" name="for_page" value="login">
<div class="group">
<label for="user" class="label">Username</label>
<input id="user" type="text" class="input" name="username" placeholder="Enter your username" >
</div>
<div class="group">
<label for="pass" class="label">Password</label>
<input id="pass" type="password" name="password_1" class="input" data-type="password" placeholder="Enter your password" >
</div>
<div class="group">
<input id="check" type="checkbox" class="check" checked>
<label for="check">
<span class="icon">
</span> Keep me Signed in
</label>
</div>
<div class="group"> <input type="submit" class="button" value="Sign In"> </div>
<div class="hr"></div>
</div>
</form>
<form method="POST" action="yoga_signup.php">
<div class="sign-up-form">
<input type="hidden" name="for_page" value="signup">
<div class="group"> <label for="user" class="label">Username</label> <input id="user" type="text" name="username" class="input" placeholder="Create your Username"> </div>
<div class="group"> <label for="pass" class="label">Password</label> <input id="pass" type="password" name="password_1" class="input" data-type="password" placeholder="Create your password" > </div>
<div class="group"> <label for="pass" class="label">Repeat Password</label> <input id="pass" type="password" name="password_2" class="input" data-type="password" placeholder="Repeat your password"> </div>
<div class="group"> <label for="pass" class="label">Email Address</label> <input id="pass" type="text" class="input" name="email" placeholder="Enter your email address" > </div><br>
<div class="group"> <input type="submit" class="button" value="Sign Up"> </div>
<div class="hr"></div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
Parameters in the PHP file after modification:
Array
(
[for_page] => login
[username] => asdf
[password_1] => asdf
)
Helpful sidenotes to improve your code:
passwords should be encrypted in the database
the mysql query is vulnerable against SQL injection
the second password field used to be required, because if the input type is password, then you can't see the characters, so it's like a proofread for the user to make sure that you won't miss the password. Because of this you don't need to store it in the database, but use it to check if it was written correctly in the first field.
use the redirection headers with die
close the mysql connection before the redirection
I found some issues at the login part of the code.
Instead of the password filed in the SQL query string you should use an existing password field from your database; for example the password_1 field.
Replacing that and fixing some minor issues, plus a bit of beautifying you will get this code for the login part:
if($TypeofRequest=="login"){
$username = $_POST['username'];
$password = $_POST['password_1'];
$sql="SELECT * FROM yoga_login WHERE username='{$username}' AND password_1='{$password}'";
$result = $conn->query($sql);
$conn->close();
if (empty($result)) {
die('invalid credentials');
}
$_SESSION['username'] = $user;
header('location:blogs.html');
die();
}

How can I make text appear on another page in a form?

I am making a get started button on my website, where the person enters his email and then presses "get started". The text should then be transferred to my login page in the email field.
Here is my code for the button:
<form method="post" action="#" class="container 50%">
<div class="row uniform 50%">
<div class="8u 12u$(xsmall)"><input type="email" name="email" id="email" placeholder="Your Email Address" /></div>
<div class="4u$ 12u$(xsmall)"><input type="button" value="Get Started" class="fit special" onclick="location.href='loginsystem/loginpage.php';"></div>
</div>
</form>
And here is my code for the login page:
<?php
/* Main page with two forms: sign up and log in */
require 'db.php';
session_start();
?>
<!DOCTYPE html>
<html>
<head>
<title>Sign-Up/Login Form</title>
<?php include 'css/css.html'; ?>
</head>
<?php
if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
if (isset($_POST['login'])) { //user logging in
require 'login.php';
}
elseif (isset($_POST['register'])) { //user registering
require 'register.php';
}
}
?>
<body style="background-color: #1c1d26">
<div class="form">
<ul class="tab-group">
<li class="tab">Sign Up</li>
<li class="tab active">Log In</li>
</ul>
<div class="tab-content">
<div id="login">
<h1>Welcome Back!</h1>
<form action="loginpage.php" method="post" autocomplete="off">
<div class="field-wrap">
<label>
Email Address<span class="req">*</span>
</label>
<input type="email" required autocomplete="off" name="email"/>
</div>
<div class="field-wrap">
<label>
Password<span class="req">*</span>
</label>
<input type="password" required autocomplete="off" name="password"/>
</div>
<p class="forgot">Forgot Password?</p>
<button class="button button-block" name="login" />Log In</button>
</form>
</div>
<div id="signup">
<h1>Sign Up for Free</h1>
<form action="loginpage.php" method="post" autocomplete="off">
<div class="top-row">
<div class="field-wrap">
<label>
First Name<span class="req">*</span>
</label>
<input type="text" required autocomplete="off" name='firstname' />
</div>
<div class="field-wrap">
<label>
Last Name<span class="req">*</span>
</label>
<input type="text"required autocomplete="off" name='lastname' />
</div>
</div>
<div class="field-wrap">
<label>
Email Address<span class="req">*</span>
</label>
<input type="email"required autocomplete="off" name='email' />
</div>
<div class="field-wrap">
<label>
Set A Password<span class="req">*</span>
</label>
<input type="password"required autocomplete="off" name='password'/>
</div>
<button type="submit" class="button button-block" name="register" />Register</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>
Thank you!
In your get started form set action="yourLoginPage.php"
<form method="post" action="yourLoginPage.php" class="container 50%">
In your login page
<input type="email" required autocomplete="off" name="email" value="<?php echo $_POST["email"]; ?>"/>

how to get the data added verification message at the same page of form

i have this page named courses.php contain the form below (iam using bootstrap):
<form class="" action="coumysql.php" method="post" style="margin-left:100px;">
<input type="hidden" name="act" value="add"/>
<div class="form-group" >
<label class="control-label" for="course_id">Course Code:</label>
<div class="" >
<div class="col-xs-3">
<input type="text" class="form-control" id="email" placeholder="" name="course_id" required="">
</div>
</div>
</div> <br>
<br>
<div class="form-group">
<label class="control-label " for="course_name">Course Name:</label>
<div class="">
<div class="col-xs-3">
<input type="text" class="form-control" id="pwd" placeholder="" name="course_name" required="">
</div>
</div>
</div><br>
<br>
<div class="form-group" style="display: inline;">
<div class="col-sm-offset-1 "><br>
<button type="submit" class="btn btn-default">Add Subject</button>
</div>
</div>
</form>
the form processed at the page named coumysql.php
<?php
include 'connect.php';
if(isset($_POST['act'])){
if($_POST['act'] == 'add'){
if ($mysqli->query("INSERT INTO courses (course_id, course_name) VALUES ('".$_POST['course_id']."', '".$_POST['course_name']."');")) {
echo "data added";
}
}else if($_POST['act'] == 'delete'){
if ($mysqli->query("DELETE FROM courses WHERE course_id= ('".$_POST['course_id']."');")) {
echo "data deleted";
}
}
}
?>
i want the message "data added" or "data deleted" to be shown in courses.php after successfully form submitted to database
You could create a session() variable and pass it to the view. Like so:
<?php
include 'connect.php';
session_start();
if(isset($_POST['act'])){
if($_POST['act'] == 'add'){
if ($mysqli->query("INSERT INTO courses (course_id, course_name) VALUES ('".$_POST['course_id']."', '".$_POST['course_name']."');")) {
$_SESSION['insert']="Data has been successfully created!";
header('Location: courses.php');
}
}else if($_POST['act'] == 'delete'){
if ($mysqli->query("DELETE FROM courses WHERE course_id= ('".$_POST['course_id']."');")) {
$_SESSION['delete']="Data has been successfully deleted!";
header('Location: courses.php');
}
}
}
?>
Then catch them on courses.php like so:
<?php
session_start();
$added = $_SESSION['insert'];
$deleted=$_SESSION['delete'];
?>
<form class="" action="coumysql.php" method="post" style="margin-left:100px;">
<input type="hidden" name="act" value="add"/>
<div class="form-group" >
<label class="control-label" for="course_id">Course Code:</label>
<div class="" >
<div class="col-xs-3">
<input type="text" class="form-control" id="email" placeholder="" name="course_id" required="">
</div>
</div>
</div> <br>
<br>
<div class="form-group">
<label class="control-label " for="course_name">Course Name:</label>
<div class="">
<div class="col-xs-3">
<input type="text" class="form-control" id="pwd" placeholder="" name="course_name" required="">
</div>
</div>
</div><br>
<br>
<div class="form-group" style="display: inline;">
<div class="col-sm-offset-1 "><br>
<button type="submit" class="btn btn-default">Add Subject</button>
</div>
<?php
if(!empty($added)){
?>
<div class="alert aler-success"><p><?php echo $added;?></p></div>
<?php }elseif(!empty($deleted)){
?>
<div class="alert aler-success"><p><?php echo $deleted;?></p></div>
<?php
}?>
</div>
</form>
Note: u can customize div tag as u want..

unable to capture form data and pass through Route in submit button

<div class="portlet-body">
<form role="form" class="form-horizontal" name="frm_edit_details" id="frm_edit_details" method="POST" action="URL::route('sample/update/')">
<?php if(isset($message) && $message != "") echo "<div class='alert alert-success alert-dismissable'>".$message."</div>"; ?>
<h4> Information </h4>
<?php foreach($lists as $list): ?>
<div class="row">
<div class="form-group">
<label class="col-md-2 control-label"> Customer ID: </label>
<div class="col-md-4">
<input type="text" class="form-control" placeholder="Number" id="CUSTOMER_ID" name="CUSTOMER_ID" value="<?php if(isset($list->CUSTOMER_ID)) echo ($list->CUSTOMER_ID); ?>" />
</div>
<label class="col-md-2 control-label">Invoice Number: </label>
<div class="col-md-4">
<input type="text" class="form-control" placeholder="Number" name="INVOICE_NO" id="INVOICE_NO" value="<?php if(isset($list->INVOICE_NO)) echo ($list->INVOICE_NO); ?>" />
</div>
<label class="col-md-2 control-label">Phone Number: </label>
<div class="col-md-4">
<input type="text" class="form-control" placeholder="Number" name="PHONE_NO" id="PHONE_NO" value="<?php if(isset($list->PHONE_NO)) echo ($list->PHONE_NO); ?>" />
</div>
</div>
</div>
<br>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
Submit
</div>
</div>
<?php endforeach; ?>
</form>
</div>
while displaying the data in PHP form from Database, it is displaying the data in form.
after making some changes and clicking on submit i am able to capture only CUSTOMER_ID data remaining phone number and invoice number i am unable to capture.
I want to capture the complete data after some changes done in the form
you are not submitting your form, because your form has no submit button.Change this line
Submit
with
<input type="submit" name="submit" value="Submit"/>
and add one extra input field in your form to send account id along with your form as
<input type="text" name="accountId" value="{{$list->ACCOUNT_ID}}"/>
So now your form get submitted on this url sample/update/{accountId} as your form action is defined

How to not allow an error message to occupy space in the DOM if error is not displayed?

I have a simple Login page where I show a error message on failed authentication. I have a div with some classes applied , and inside it I display the error message through a <label.../>.
Now when the page is loaded for the first time, there is obviously no error message and thus there is an blank space left.
What I want is if there is no error message, the div should occupy no space or should be hidden and should only show if there is any text(error message) inside the div.
Here is my HTML :
<form id="login-form" action="authenticate.php" method="post" role="form" style="display: block;">
<div class="form-group">
<input type="text" name="login_email" id="login_email" tabindex="1" class="form-control" placeholder="Email" value="">
</div>
<div class="form-group">
<input type="password" name="login_password" id="login_password" tabindex="2" class="form-control" placeholder="Password">
</div>
<div class="form-group text-center">
<label style="color:red"><?php if(isset($error)) echo $error; ?></label>
</div>
<div class="form-group text-center">
<input type="checkbox" tabindex="3" class="" name="remember" id="remember">
<label for="remember"> Remember Me</label>
</div>
<div class="form-group">
<div class="row">
<div class="col-sm-6 col-sm-offset-3">
<input type="submit" name="login-submit" id="login-submit" tabindex="4" class="form-control btn btn-login" value="Log In">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-12">
<div class="text-center">
Forgot Password?
</div>
</div>
</div>
</div>
</form>
PHP code :
<?php
if(isset($_GET['login_error'])){
if($_GET['login_error']== 'true'){
$error = "Email and/or Password was incorrect! Please try again!";
}
}
?>
Change it so that it calls out all the HTML in the php function. Like this
<?php
if(isset($_GET['login_error'])){
if($_GET['login_error']== 'true'){
$error = '<div class="form-group text-center">';
$error .= '<label style="color:red">Email and/or Password was incorrect! Please try again!</label>';
$error .= '</div>';
}
}
?>
<form id="login-form" action="authenticate.php" method="post" role="form" style="display: block;">
<div class="form-group">
<input type="text" name="login_email" id="login_email" tabindex="1" class="form-control" placeholder="Email" value="">
</div>
<div class="form-group">
<input type="password" name="login_password" id="login_password" tabindex="2" class="form-control" placeholder="Password">
</div>
<!-- ERROR MESSAGE IS HERE -->
<?php if(isset($error)) echo $error; ?>
<div class="form-group text-center">
<input type="checkbox" tabindex="3" class="" name="remember" id="remember">
<label for="remember"> Remember Me</label>
</div>
<div class="form-group">
<div class="row">
<div class="col-sm-6 col-sm-offset-3">
<input type="submit" name="login-submit" id="login-submit" tabindex="4" class="form-control btn btn-login" value="Log In">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col-lg-12">
<div class="text-center">
Forgot Password?
</div>
</div>
</div>
</div>
</form>
Change the content of the if statement to include the entire element, like so:
<?php if(isset($error)) { ?>
<div class="form-group text-center">
<label style="color:red"><?php echo $error; ?></label>
</div>
<?php } ?>

Categories