Display signature image in email - php
I was looking for a signature pad and came across a plugin by Thomas Bradley.
I'm trying ti display the signature as an image in an email. All I get is an image code
Client signature:
[{"lx":69,"ly":44,"mx":69,"my":43},{"lx":68,"ly":43,"mx":69,"my":44},{"lx":68,"ly":44,"mx":68,"my":43},{"lx":69,"ly":48,"mx":68,"my":44},{"lx":72,"ly":55,"mx":69,"my":48},{"lx":77,"ly":67,"mx":72,"my":55},{"lx":85,"ly":82,"mx":77,"my":67},{"lx":90,"ly":96,"mx":85,"my":82},{"lx":93,"ly":107,"mx":90,"my":96},{"lx":95,"ly":114,"mx":93,"my":107},{"lx":97,"ly":117,"mx":95,"my":114},{"lx":98,"ly":117,"mx":97,"my":117},{"lx":102,"ly":113,"mx":98,"my":117},{"lx":110,"ly":102,"mx":102,"my":113},{"lx":120,"ly":86,"mx":110,"my":102},{"lx":131,"ly":68,"mx":120,"my":86},{"lx":139,"ly":53,"mx":131,"my":68},{"lx":143,"ly":48,"mx":139,"my":53},{"lx":145,"ly":47,"mx":143,"my":48},{"lx":147,"ly":49,"mx":145,"my":47},{"lx":154,"ly":55,"mx":147,"my":49},{"lx":159,"ly":62,"mx":154,"my":55},{"lx":161,"ly":68,"mx":159,"my":62},{"lx":162,"ly":73,"mx":161,"my":68},{"lx":162,"ly":75,"mx":162,"my":73},{"lx":162,"ly":74,"mx":162,"my":75},{"lx":166,"ly":66,"mx":162,"my":74},{"lx":173,"ly"
:53,"mx":166,"my":66},{"lx":180,"ly":37,"mx":173,"my":53},{"lx":182,"ly":27,"mx":180,"my":37},{"lx":182,"ly":23,"mx":182,"my":27},{"lx":178,"ly":31,"mx":182,"my":23},{"lx":169,"ly":45,"mx":178,"my":31},{"lx":163,"ly":59,"mx":169,"my":45},{"lx":161,"ly":66,"mx":163,"my":59},{"lx":163,"ly":68,"mx":161,"my":66},{"lx":170,"ly":64,"mx":163,"my":68},{"lx":183,"ly":55,"mx":170,"my":64},{"lx":205,"ly":43,"mx":183,"my":55},{"lx":230,"ly":32,"mx":205,"my":43},{"lx":267,"ly":22,"mx":230,"my":32},{"lx":300,"ly":12,"mx":267,"my":22},{"lx":307,"ly":9,"mx":300,"my":12},{"lx":308,"ly":8,"mx":307,"my":9}]
PHP Code:
<?php
require_once("session.php");
require_once("class.user.php");
$auth_user = new USER();
$user_id = $_SESSION['user_session'];
$stmt = $auth_user->runQuery("SELECT * FROM users WHERE user_id=:user_id");
$stmt->execute(array(":user_id"=>$user_id));
$userRow=$stmt->fetch(PDO::FETCH_ASSOC);
if ($_POST['submit']) {
if (!$_POST['output']) {
$error = "<br>- Please enter your signature!";
}
if ($error) {
$result = "<div class='alert alert-danger' role='alert'>Whoops, there is an error. Please correct the following: $error</div>";
} else {
mail("albetws#gmail.com", "Request form", "From: ".$_POST['username']."
Message: ".$_POST['message']."
Client signature: ".$_POST['output']);
{
$result = "<div class='alert alert-success text-center' role='alert'>
<p>Thank you for your request.</p>
<p>No request conformation within 1 hr call the receiver</p>
<p>Please <a href='logout.php?logout=true'>Logout</a>.</p>
</div>";
}
}
}
?>
<!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">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Title</title>
<!-- Bootstrap -->
<link href="signature/assets/jquery.signaturepad.css" rel="stylesheet">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.css">
<!--[if lt IE 9]><script src="../assets/flashcanvas.js"></script><![endif]-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
</head>
<body>
<section>
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-4 col-sm-offset-4">
<h2 class="text-center">Client Approval</h2>
<p class="text-center">Return to Main Menu / Logout</p>
<?php echo $result;?>
<form action="" method="post" role="form" class="sigPad">
<p class="drawItDesc">Insert signature in the box below.</p>
<div class="sig sigWrapper">
<canvas class="pad" height="150"></canvas>
<input type="hidden" name="output" class="output">
</div>
<div class="form-group input-group btn-margin">
<span class="input-group-addon">
<span class="glyphicon glyphicon-remove"></span>
</span>
<input type="button" name="clear" class="form-control btn btn-primary clearButton" value="Clear signature">
</div>
<div class="form-group input-group btn-margin">
<span class="input-group-addon">
<span class="glyphicon glyphicon-send"></span>
</span>
<input type="submit" name="submit" class="form-control btn btn-primary" value="Submit signature">
</div>
</form>
</div>
</div>
</div>
</section>
<script src="signature/jquery.signaturepad.js"></script>
<script>
$(document).ready(function() {
var options = {
defaultAction: 'drawIt',
drawOnly: true,
lineTop: 135,
lineMargin: 20,
penColour: '#000'
}
$('.sigPad').signaturePad(options);
});
</script>
<script src="signature/assets/json2.min.js"></script>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>
Thank you
I used a litte time befor szimek pad signature under MIT License from github.com web site,
otherwise i don't see in your code in wich format you save you image.
Related
how to prevent from going back to login page after logging in
I have developed a website in php. The index.php is a login form. After logging in dashboard.php is coming. But when I press the back button in the browser it is redirecting to the login page. How to prevent it. If there is any solution please tell. Thanks in advance. The codes are given below:
index.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="style.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>
<body style="background-image: url('https://www.pixelstalk.net/wp-content/uploads/2016/05/HD-Black-Picture.jpg');">
<section id="login">
<div class="container">
<div class="row">
<div class="col-sm-2"></div>
<div class="col-sm-8 col1">
<div class="row">
<div class="col-sm-7 co2">
<h1 class="h1">Orbit Shifters Employee Site</h1>
<h2 class="h2">Login Here <i class="fas fa-long-arrow-alt-right"></i></h2>
</div>
<div class="col-sm-5 co1">
<form method="post" action="func.php">
<div>
<input type="text" name="username" class="i1" placeholder="Enter Your Username">
</div>
<div>
<input type="password" name="password" class="i1" placeholder="Enter Your Password">
</div>
<div>
<input type="submit" name="submit" class="btn btn1">
</div>
</form>
</div>
</div>
</div>
<div class="col-sm-2"></div>
</div>
</div>
</section>
</body>
</html>
func.php
<?php
session_start();
$con=mysqli_connect("localhost","root","","login");
$connect = new PDO('mysql:host=localhost;dbname=login', 'root', '');
if(isset($_POST['submit'])){
$username=$_POST['username'];
$password=$_POST['password'];
$query="select * from signup where username='$username' and password='$password';";
$result=mysqli_query($con,$query);
$row=mysqli_fetch_assoc($result);
if(mysqli_num_rows($result)==1)
{
$_SESSION["username"] = $username;
$_SESSION['status']="Active";
header("Location:dashboard.php?name=".$row['name']);
exit;
}
else{
echo "<script>alert('Enter Correct Details!!')</script>";
echo "<script>window.open('index.php', '_self')</script>";
}
}
?>
dashboard.php
<?php
session_start();
if($_SESSION['status']!="Active")
{
header("location:index.php");
}
else{
$name=$_GET['name'];
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="style.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>
<body style="background:url(https://i.pinimg.com/originals/e5/f3/af/e5f3af2b9186af6e86187c84f4ad930e.jpg);">
<nav class="navbar navbar-inverse">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="dashboard.php?name=<?php echo $name; ?>">Dashboard</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li class="li1"><span class="glyphicon glyphicon-log-in"></span> Logout</li>
</ul>
</div>
</div>
</nav>
<section id="dashboard">
<div class="container">
<div class="row ro1">
<p class="p1"> Hello <?php echo $name; ?>, Welcome to Orbit Shifters EMployee Site.</p>
</div>
<div class="ro1">
<div class="col-sm-4 col2">
<button class="btn btn2">Project 1 <br>Report <br>Submission</button>
</div>
<div class="col-sm-4 col2">
<button class="btn btn2">Project 2 <br>Monthly Report <br>Submission</button>
</div>
<div class="col-sm-4 col2">
<button class="btn btn2">Project 3 <br>Feedback <br>Submission</button>
</div>
</div>
</div>
</section>
</body>
</html>
<?php
}
?>
logout.php
<?php
session_start();
session_destroy();
$_SESSION = array();
unset($_SESSION['username']);
unset($_SESSION['status']);
header("Location:index.php");
?>
I am not sure if I understand the problem correctly, but what if you add a check at the beginning of the index.php file that would redirect you to the dashboard if you are logged in ? Something like this
// index.php
<?php
session_start();
if (isset($_SESSION['status']) && $_SESSION['status'] === "Active") {
header("location: dashboard.php");
}
?>
<!DOCTYPE html>
<html>
<head>
...
this way, if you click back in the browser, you will still go to index.php, but then you will be redirected to the dashboard again if you are already logged in
$_SESSION['login_user'] not workig
I'm trying to figuring out what the problem but I can't.
Basically I have the index.php with a login to an admin area and admin.php that Is the main page of the admin area.
If I remove the SESSION from the admin.php page the login itself works but I can reach the page admin.php without logging into index, but if I add the SESSION to admin.php after the login it goes straight to the else at the end of the admin.php page.
For sure I'm failing something with the SESSION but I don't know what.
Index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<link rel="icon" type="image/png" href="images/favico.png">
<title>eWaste</title>
<!-- Font Awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Material Design Bootstrap -->
<link href="css/mdb.min.css" rel="stylesheet">
<!-- Your custom styles (optional) -->
<link href="css/style.css" rel="stylesheet">
<style>
html{
margin-top: 100px;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light grey lighten-5 fixed-top">
<div class="container">
<a class="navbar-brand" href="../index.php">
<img src="../images/logo.png" height="30" class="d-inline-block align-top" alt="">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="navbarResponsive">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" id="navi-current" href="index.php">Admin</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Navbar -->
<!--Main-->
<main class="mb-4 pb-5">
<div class="container">
<div class="row">
<div class="col-xl-4 col-lg-4 col-md-3"></div>
<div class="col-xl-4 col-lg-4 col-md-6">
<form class="text-center border border-light p-5" method="post" name="">
<p class="h4 mb-4">Sign in</p>
<!-- Email -->
<input type="text" id="materialContactFormUsername" class="form-control" placeholder="User" name="formuser">
<!-- Password -->
<input type="password" id="defaultLoginFormPassword" class="form-control mb-4" placeholder="Password" name="formpass">
<!-- Login button -->
<button class="btn btn-info btn-block my-4" type="submit" name="submit">Sign in</button>
</form>
</div>
<div class="col-xl-4 col-lg-4 col-md-3"></div>
</div>
</div>
</main>
<!--/.Main-->
<?php
if (isset($_POST['submit']))
{
include 'conn.php';
session_start();
$user = $_POST['formuser'];
$pass = $_POST['formpass'];
$query = mysqli_query($conn, "SELECT user FROM login WHERE user='$user' and pass='$pass'");
if (!$query) {
die('Invalid query: ' . mysqli_error());
}
if (mysqli_num_rows($query) != 0){
$_SESSION['login_user']=$username;
header("Location: admin.php");
}
else{
echo "<script type='text/javascript'>alert('User Name Or Password Invalid!')</script>";
}
mysqli_close($conn);
}
?>
<!--Footer-->
<?php include 'footer.php';?>
<!--/.Footer-->
<!-- SCRIPTS -->
<!-- JQuery -->
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
<!-- Bootstrap tooltips -->
<script type="text/javascript" src="js/popper.min.js"></script>
<!-- Bootstrap core JavaScript -->
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- MDB core JavaScript -->
<script type="text/javascript" src="js/mdb.min.js"></script>
<!-- Initializations -->
<script type="text/javascript">
// Animations initialization
new WOW().init();
</script>
</body>
Admin.php
<?php
if (isset($_SESSION['login_user'])){
session_start();
echo "ok";
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<link rel="icon" type="image/png" href="images/favico.png">
<title>eWaste</title>
<!-- Font Awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Material Design Bootstrap -->
<link href="css/mdb.min.css" rel="stylesheet">
<!-- Your custom styles (optional) -->
<link href="css/style.css" rel="stylesheet">
<style>
html{
margin-top: 100px;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light grey lighten-5 fixed-top">
<div class="container">
<a class="navbar-brand" href="../index.php">
<img src="../images/logo.png" height="30" class="d-inline-block align-top" alt="">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="navbarResponsive">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" id="navi-current" href="index.php">Admin</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Navbar -->
<!--Main-->
<main class="mb-4 pb-5">
<div class="container">
<div class="row">
<div class="col-xl-4 col-lg-4 col-md-3"></div>
<div class="col-xl-4 col-lg-4 col-md-6">
</div>
<div class="col-xl-4 col-lg-4 col-md-3"></div>
</div>
</div>
</main>
<!--/.Main-->
<!--Footer-->
<?php include 'footer.php';?>
<!--/.Footer-->
<!-- SCRIPTS -->
<!-- JQuery -->
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
<!-- Bootstrap tooltips -->
<script type="text/javascript" src="js/popper.min.js"></script>
<!-- Bootstrap core JavaScript -->
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- MDB core JavaScript -->
<script type="text/javascript" src="js/mdb.min.js"></script>
<!-- Initializations -->
<script type="text/javascript">
// Animations initialization
new WOW().init();
</script>
</body>
</html>
<?php
}
else{
echo "no";
exit();
}
?>
Please try to place this code
<?php
if (isset($_POST['submit']))
{
include 'conn.php';
session_start();
$user = $_POST['formuser'];
$pass = $_POST['formpass'];
$query = mysqli_query($conn, "SELECT user FROM login WHERE user='$user' and pass='$pass'");
if (!$query) {
die('Invalid query: ' . mysqli_error());
}
if (mysqli_num_rows($query) != 0){
$_SESSION['login_user']=$username;
header("Location: admin.php");
}
else{
echo "<script type='text/javascript'>alert('User Name Or Password Invalid!')</script>";
}
mysqli_close($conn);
}
?>
At the Start of the page. You can not assign value into the session if you print something on browser. It will give you warnings.
Configuring a login feature
This is my first time using a template. I'm a beginner.
Since I used adminlte template my codes stop working properly.
HTML Code:
<!DOCTYPE html>
enter code here<?php
session_start();
?>
<html>
<head>
<meta charset="UTF-8">
<title>Admin Panel | Log in</title>
<!-- Tell the browser to be responsive to screen width -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap 3.3.6 -->
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="font-awesome/font-awesome-2/css/font-awesome.min.css">
<!-- Ionicons -->
<link rel="stylesheet" href="ionicons/ionicons2/css/ionicons.min.css">
<!-- Theme style -->
<link rel="stylesheet" href="dist/css/AdminLTE.min.css">
<!-- iCheck -->
<link rel="stylesheet" href="plugins/iCheck/square/blue.css">
<style type="text/css">
.img-bg-mine{
background: url('images/loginbg.jpg') no-repeat center center fixed; background-size: cover;
}
</style>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="hold-transition login-page img-bg-mine">
<div class="login-box">
<div class="login-logo">
<b>Student</b> Evaluation
</div>
<!-- /.login-logo -->
<div class="login-box-body">
<p class="login-box-msg">Sign in to start your session</p>
<form action="login.php" method="post">
<div class="form-group has-feedback">
<div class="input-group">
<input type="text" class="form-control" placeholder="Enter Your Username" name="login_username" id="login_username">
<span id="errorUsername"></span>
<span class="input-group-addon">
<i class="fa fa-user"></i>
</span>
</div>
</div>
<div class="form-group has-feedback">
<div class="input-group">
<input type="password" class="form-control" placeholder="Enter Your Password" name="login_password" id="login_password">
<span id="errorPassword"></span>
<span class="input-group-addon">
<i class="fa fa-lock"></i>
</span>
</div>
<br>
<div class="row">
<div class="col-xs-12">
<button type="submit" class="btn bg-olive btn-flat pull-right btn-lg" name="login" id="login">Sign In</button>
</div>
</div>
</form>
</div>
<!-- /.login-box-body -->
</div>
<!-- jQuery 2.2.3 -->
<script src="plugins/JQuery/jquery-2.2.3.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="bootstrap/js/bootstrap.min.js"></script>
</body>
</html>
PHP Code:
<?php
include 'dbcon.php';
?>
<?php
if(isset($_POST['login'])){
$username = mysqli_real_escape_string($conn,$_POST['login_username']);
$password = mysqli_real_escape_string($conn,$_POST['login_password']);
//select user from database
$select_user = "SELECT * from tb_admin where admin_user='$username' and admin_pass='$password'";
//run query
$login =mysqli_query($conn,$select_user);
$count =mysqli_num_rows($login);
$row= mysqli_fetch_array($login);
if ($count > 0){
session_start();
$_SESSION['id']=$row['admin_id'];
echo "<script>window.open('adminpanel.php','_self')</script>";// this part is not working it only shows the word window.open('adminpanel.php','_self') instead of showing the page adminpanel.php
}else
{
echo "<script>alert('Login failed..')</script>";// same here
echo "<script>window.open('index.php','_self')</script>";// same here
}
}
?>
It looks like my script in login.php is not working. It just shows the text nothing more.
HTML form, link error
I have a very weird problem. I'm coding login system and i have two buttons in form; one is for submitting and second is link and is used to send user to register page. My problem is that when i click that link form is submitted instead of redirection. Here is link to page: http://takeaprize.pl/login.php And page code: <?php include_once 'secure/core.php'; ?> <!DOCTYPE html> <html> <head> <title><?php echo $settings->getSiteTitle(); ?> - Login</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta charset="UTF-8" /> <meta name="description" content="<?php echo $settings->getMETAdescription(); ?>" /> <meta name="keywords" content="<?php echo $settings->getMETAkeywords(); ?>" /> <link rel="icon" type="image/ico" href="assets/images/favicon.ico" /> <!-- Bootstrap --> <link href="assets/css/vendor/bootstrap/bootstrap.min.css" rel="stylesheet"> <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> <link href="assets/css/minimal.css" rel="stylesheet"> <link rel="stylesheet" href="assets/js/vendor/jgrowl/css/jquery.jgrowl.min.css"> <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script> <![endif]--> </head> <body class="bg-1"> <!-- Wrap all page content here --> <div id="wrap"> <!-- Make page fluid --> <div class="row"> <!-- Page content --> <div id="content" class="col-md-12 full-page login"> <div class="inside-block"> <img src="assets/images/logo-big.png" alt class="logo"> <h1><strong>Welcome</strong> Guest</h1> <h5><?php echo $settings->getSiteTitle(); ?></h5> <form id="login_form" class="form-signin" action=""> <section> <div class="input-group"> <input type="text" class="form-control" name="username" placeholder="Username"> <div class="input-group-addon"><i class="fa fa-user"></i></div> </div> <div class="input-group"> <input type="password" class="form-control" name="password" placeholder="Password"> <div class="input-group-addon"><i class="fa fa-key"></i></div> </div> </section> <section class="controls"> Forgot password? </section> <section class="log-in"> <button class="btn btn-greensea"><i class="fa fa-lock"></i> Log In</button> <span>or</span> <button class="btn btn-slategray"><i class="fa fa-sign-out"></i> Create an account</button> </section> </form> </div> </div> <!-- /Page content --> </div> </div> <!-- Wrap all page content end --> </body> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="https://code.jquery.com/jquery.js"></script> <script src="assets/js/vendor/jgrowl/jquery.jgrowl.min.js"></script> </html> Thanks in advance for any help
How to hide a div on php and html
im new on this section (html php...)
I have a code, is a login form, and, i want, to hide the red box of (Incorrect user or password) from the login form but i dont know how can i do this.
An screenshot: http://prntscr.com/5daqsh
the code is:
<head>
<meta charset="utf-8" />
<title>My Website</title>
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="css/animate.css" type="text/css" />
<link rel="stylesheet" href="css/font-awesome.min.css" type="text/css" />
<link rel="stylesheet" href="css/font.css" type="text/css" />
<link rel="stylesheet" href="js/fuelux/fuelux.css" type="text/css" />
<link rel="stylesheet" href="css/app.css" type="text/css" />
<body background="images/login-bg.jpg">
<!--[if lt IE 9]>
<script src="js/ie/html5shiv.js"></script>
<script src="js/ie/respond.min.js"></script>
<script src="js/ie/excanvas.js"></script>
<![endif]-->
</head>
<body>
<section id="content" class="m-t-lg wrapper-md animated fadeInUp">
<div class="container aside-xxl">
<a class="navbar-brand block" href="index.html">DameFans</a>
<section class="panel panel-default bg-white m-t-lg">
<header class="panel-heading text-center">
<strong>Iniciar Sesión</strong>
</header>
<form action="" method="post" class="panel-body wrapper-lg">
<div class="form-group">
<div class="alert alert-danger">
<?php
session_start();
include_once "conexion.php";
function verificar_login($user,$password,&$result)
{
$sql = "SELECT * FROM users WHERE login='$user' and pass='$password'";
$rec = mysql_query($sql);
$count = 0;
while($row = mysql_fetch_object($rec))
{
$count++;
$result = $row;
}
if($count == 1)
{
return 1;
}
else
{
return 0;
}
}
if(!isset($_SESSION['userid']))
{
if(isset($_POST['login']))
{
if(verificar_login($_POST['user'],$_POST['password'],$result) == 1)
{
$_SESSION['userid'] = $result->id;
header("location:index.html");
}
else
{
echo '<div class="error">Su usuario es incorrecto, intente nuevamente.</div>';
}
}
?>
</div>
<label class="control-label">Email</label>
<input name="user" type="text" class="form-control input-lg">
</div>
<div class="form-group">
<label class="control-label">Contraseña</label>
<input name="password" type="password" class="form-control input-lg">
</div>
<div class="checkbox">
<label>
<input type="checkbox"> Mantener mi sesión
</label>
</div>
<small>Recuperar contraseña</small>
<button type="submit" name="login" type="submit" value="login" class="btn btn-primary">Acceder</button>
<div class="line line-dashed"></div>
<i class="fa fa-facebook pull-left"></i>Acceder vía Facebook
<i class="fa fa-twitter pull-left"></i>Acceder vía Twitter
<div class="line line-dashed"></div>
<p class="text-muted text-center"><small>¿Aún no tienes cuenta?</small></p>
Crear cuenta ahora
</form>
</section>
</div>
</section>
<div class="alert alert-success">
<?php
} else {
echo '<i class="fa fa-ban-circle"></i><strong>Ha accedido correctamente</strong> <a href="index.html" class="alert-link">Serás redirigido al panel automáticamente en breve.';
echo 'Cerrar Sesión<br>';
echo '<meta http-equiv="refresh" content="3;url=index.html">';
}
?>
</div>
If anyone can help me to hide the block until a user fail login in or something please :)
First, you have to put your "session_start()" in the first line of your code file.
Second, Php is the server language. So, it will be excute before any others statics language.
In the footer, put something like this (i presume you have jQuery)
$('.alert').hide(); //hide on load page
Put your HTML normaly and in the bottom, make your login check.
If the check is in error, do this :
$('.alert').show();
And that's it.
If your question is "How to show HTML/JS in PHP?", do this :
<?php echo "$('.alert').show();"?>;
in a JS block and "document ready".