CODEWITHSUNDEEP
javascriptphphtmlmysql
user11137294
user11137294

Reputation:

Post and retrieve MySQL data from PHP into html with request

First of all I want to note that I am very new with HTML and PHP, JS and web design at all, but I have to learn and create registration form for my personal page, and should find out with proper approach and possible method.

I have index.php with user login and registration forms. Inside <!DOCTYPE html><html><body> ... </body></html> login form includes input type="text" and type="password": 

<div id="loginWrap">
 <div class="container">
  <form action="login.php" method="post" id="logform">
    <div class="row">
      <div class="col-25">
        <label for="fname">Username:</label>
      </div>
      <div class="col-75">
        <input type="text" id="yuser" name="username" placeholder="Username.." required>
      </div>
    </div>
    <div class="row">
      <div class="col-25">
        <label for="lname">Password:</label>
      </div>
      <div class="col-75">
        <input type="password" id="ypass" name="password" placeholder="Password.." required>
      </div>
    </div>
  <br/>
    <div class="row">
      <div class="col-25">
        <label for="lname"></label>
      </div>
      <input type="submit" value="Login" id="logBtn">
    </div>
  </form>
</div>

sends name="username" to PHP with action="login.php" in <Form>, which was separate login.php code document used this way from index.html. Now it is included to index.php just as it was separately, without any edit:

<?php
require 'connect.php';

$Username = mysqli_real_escape_string($con, $_POST['username']);
$Password = mysqli_real_escape_string($con, md5($_POST["password"]));

  $SQL = "INSERT INTO registration (username, password) VALUES ('$Username', '$Password')";  
  if (!mysqli_query($con, $SQL))
  {
      echo 'Not Inserted';
  }
  else
  {
     echo 'Inserted';
  }      
?>

How to pass inserted name="username" and name="password" to $_POST['username'] and $_POST['password'] in same index.php page with press on <input type="submit" value="Login" id="logBtn"> and avoid processing of this code with index.php page loading automatically.

Any guide, explanation or advice would be very helpful

Upvotes: 1

Views: 1707

Answers (2)

Pathik Vejani
Pathik Vejani

Reputation: 4491

You can use AJAX to achieve this.

HTML:

<div id="loginWrap">
  <div class="container">
      <div class="row">
        <div class="col-25">
          <label for="fname">Username:</label>
        </div>
        <div class="col-75">
          <input type="text" id="yuser" name="username" placeholder="Username.." required>
        </div>
      </div>
      <div class="row">
        <div class="col-25">
          <label for="lname">Password:</label>
        </div>
        <div class="col-75">
          <input type="password" id="ypass" name="password" placeholder="Password.." required>
        </div>
      </div>
      <br/>
      <div class="row">
        <div class="col-25">
          <label for="lname"></label>
        </div>
        <input type="button" value="Login" id="logBtn">
      </div>
  </div>

AJAX:

<script type="text/javascript" >
    $("#logBtn").click(function() {
      var uname = $("#yuser").val();
      var pass = $("#ypass").val();
      if(uname == '') {
        alert('Please enter username.')
      } else if (pass == '') {
        alert('Please enter password.')
      } else {
        $.ajax ({
          url: 'login.php',
          data: {username: uname, password: pass},
          type: 'post',
          success: function(result)
          {
            // here you will get result
            console.log(result);
          }
        });
      }
    });
  </script>

Login.php:

require 'connect.php';
  if( isset($_POST['username']) && isset($_POST['password'])) {
    $uname = mysqli_real_escape_string($con, $_POST['username']);
    $pwd = mysqli_real_escape_string($con, md5($_POST["password"]));
    if($uname == '' || $pwd == '') {
      echo 'Please enter required information';
    } else {
      $query = "INSERT INTO registration (username, password) VALUES ('$uname', '$pwd')";
      if (!mysqli_query($con, $query))
      {
        echo $uname." cannot be registered! Please try again.";
        <!-- echo 'Not Inserted'; -->
      }
      else
      {
        // instead of msg you can return username like below:
        echo $uname." registered successfully!";
        // echo 'Inserted';
      }
    }
  } else {
    echo 'Something is wrong!';
  }

Upvotes: 0

sh1hab
sh1hab

Reputation: 670

just check for if the submitted value is present . then run the query.

<?php
require 'connect.php';

if( isset( $_POST['username'] ) && isset( $_POST['password'] )  ){

$Username = mysqli_real_escape_string($con, $_POST['username']);
$Password = mysqli_real_escape_string($con, md5($_POST["password"]));

  $SQL = "INSERT INTO registration (username, password) VALUES ('$Username', '$Password')";  
  if (!mysqli_query($con, $SQL))
  {
      echo 'Not Inserted';
  }
  else
  {
     echo 'Inserted';
  }      
} 


?>

Upvotes: 1

Related Questions