Untitled

<?php
// For at have adgang til sessions-variablen
session_start();

$servername = "localhost";
$username = "root";
$password = "";
$dbname = "projektV";


// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

// hvis navn og pw er udfyldt, check deres værdi
if(!empty( $_POST['bruger'] ) && !empty( $_POST['pw'] )) {
  // her vil man altid checke ved at slå op i database
  // og det gør vi også i næste eksempel

  $navn = $_POST['bruger'];
  $pw = $_POST['pw'];
  $tjeklogin = "SELECT bruger,password,id FROM login WHERE bruger = '$navn' AND password = '$pw';";
  $result = $conn->query($tjeklogin);

  // er brugernavn og password udfyldt korrekt?
  if($result->num_rows > 0) {
    $row = $result->fetch_assoc();
    $id = $row['id'];
    // husk brugernavn på sessionen
    $_SESSION['bruger'] = $navn;
    $_SESSION['id'] = $id;
    // viderestil til forside
    header('location:styring2.php');
  }
}

if (isset($_POST['Login'])){
  header('location:styring2.php');
  echo 'hejsader';
}
?>


<!DOCTYPE html>
<html>
<head>
  <style>
  /* Bordered form */
form {
  border: 3px solid #f1f1f1;
}

/* Full-width inputs */
input[type=text], input[type=password] {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  box-sizing: border-box;
}

/* Set a style for all buttons */
button {
  background-color: #4CAF50;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  width: 100%;
}

/* Add a hover effect for buttons */
button:hover {
  opacity: 0.8;
}

/* Extra style for the cancel button (red) */
.cancelbtn {
  width: auto;
  padding: 10px 18px;
  background-color: #f44336;
}

/* Center the avatar image inside this container */
.imgcontainer {
  text-align: center;
  margin: 24px 0 12px 0;
}

/* Avatar image */
img.avatar {
  width: 40%;
  border-radius: 50%;
}

/* Add padding to containers */
.container {
  padding: 16px;
}

/* The "Forgot password" text */
span.psw {
  float: right;
  padding-top: 16px;
}

/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
  span.psw {
    display: block;
    float: none;
  }
  .cancelbtn {
    width: 100%;
  }
}
</style>
</head>

<form method="post">
  <div class="imgcontainer">
    <img src="img_avatar2.png" alt="Avatar" class="avatar">
  </div>

  <div class="container">
    <label for="uname"><b>Username</b></label>
    <input type="text" placeholder="Enter Username" name="bruger" required>

    <label for="psw"><b>Password</b></label>
    <input type="password" placeholder="Enter Password" name="pw" required>

    <button type="submit" name = 'Login'>Login</button>
    <label>
      <input type="checkbox" checked="checked" name="remember"> Remember me
    </label>
  </div>

  <div class="container" style="background-color:#f1f1f1">
    <button type="button" class="cancelbtn">Cancel</button>
    <span class="psw">Forgot <a href="#">password?</a></span>
  </div>
</form>
  </body>
</html>