Untitled

<?php
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = '';
$dbname = "practice";
$conn = mysqli_connect($dbhost, $dbuser, $dbpass, $dbname);
if(!$conn ) {
    die('Could not connect: ' . mysqli_error());
}
$sql = "SELECT * FROM users ";
$result = mysqli_query($conn, $sql);
if ($result->num_rows > 0) {
    while($row = $result->fetch_assoc()) {
//        array_push($result_array, $row);
    }
}
?>

<?php
    $dbhost = 'localhost';
    $dbuser = 'root';
    $dbpass = '';
    $dbname = "practice";
    $conn = mysqli_connect($dbhost, $dbuser, $dbpass, $dbname);
    if(!$conn ) {
        die('Could not connect: ' . mysqli_error());
    }
    $name = $_POST['name'];
    $email = $_POST['email'];
    $pass = $_POST['pass'];
    if(isset($_FILES['image'])) {
        $target_file = "uploads/" . basename($_FILES["image"]["name"]);
        move_uploaded_file($_FILES["image"]["tmp_name"], $target_file);
    }
    $sql = "INSERT INTO users values(null, '$name', '$email', '$pass', '$target_file')";
        $result = mysqli_query($conn, $sql);
?>

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <link rel="stylesheet" href="./bootstrap-4.0.0/dist/css/bootstrap.min.css">
    <script src="./jquery-3.1.1.min.js"></script>
    <title>Document</title>
</head>
<body>

<div class="container-fluid">
    <div class="row justify-content-md-center pt-5 pb-5">
        <div class="col-md-4">
            <h2 class="text-center">Add New User</h2>
            <form id="myform" method="POST" action="./server.php" enctype="multipart/form-data">
                <div class="form-group">
                    <label for="name">Name:</label>
                    <input type="text" class="form-control" name="name" id="name" placeholder="Enter your full name">
                </div>

                <div class="form-group">
                    <label for="email">Email:</label>
                    <input type="text" class="form-control" name="email" id="email" placeholder="Enter your email">
                </div>

                <div class="form-group">
                    <label for="pass">Password:</label>
                    <input type="password" class="form-control" name="pass" id="pass" placeholder="Enter new password">
                </div>

                <div class="form-group input-group">
                    <label for="im">Display Picture:</label>
                    <input type="file" class="form-control-file" name="image" id="im"  accept="image/*">
                </div>

                <input type="submit" onclick="return validateForm()" class="pull-right btn btn-outline-primary">
            </form>
        </div>
    </div>

    <button onclick="getData()" class="btn btn-primary btn-lg">Show Users</button>

</div>

<div id="user">

</div>

<script>
 function validateForm() {


     var name = document.getElementById("name");
     var email = document.getElementById("email");
     var pass = document.getElementById("pass");

     var nameRegex = /^[\w\s]+$/;
     var emailRegex = /^[\w.]+@[.\w]+$/;
     var passRegex = /^.{8,}$/;

     var result = true;

     if(!nameRegex.test(name.value)) {
         name.classList.add("border-danger");
         result = false;
     }

     if(!emailRegex.test(email.value)) {
         email.classList.add("border-danger");
         result = false;
     }

     if(!passRegex.test(pass.value)) {
         pass.classList.add("border-danger");
         result = false;
     }


     return result;
 }

 function getData() {

     $.ajax({
         method: "POST",
         url: "./getData.php"
     }).done(function (data) {
         // var result = $.parseJSON(data);

         var users = document.getElementById("user");
        users.innerText = data;
     });
 }


</script>
</body>
</html>


<html>
  <head>
    <title>Ajax Search Box using PHP and MySQL</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">        </script>
     <script src="typeahead.min.js"></script>
    </head>
    <body>
     <input type="text" name="typeahead">
    </body>
    </html>
 <script>
    $(document).ready(function(){
    $('input.typeahead').typeahead({
        name: 'typeahead',
        remote:'search.php?key=%QUERY',
        limit : 10
    });
});
    </script>
<?php
    $key=$_GET['key'];
    $array = array();
    $con=mysqli_connect("localhost","root","","demos");
    $query=mysqli_query($con, "select * from cfg_demos where title LIKE '%{$key}%'");
    while($row=mysqli_fetch_assoc($query))
    {
      $array[] = $row['title'];
    }
    echo json_encode($array);
    mysqli_close($con);
?>

<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("p").hide();
  });
  $("#show").click(function(){
    $("p").show();
  });
});
</script>