Implement code ajax already ready

Question

I’d like to instead send it to another pagin. Use ajax but I don’t know if it would be possible to just change some things in the code or if I would have to redo the code... ?

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header amigo">
        <h5 class="modal-title" id="exampleModalLabel">Login</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
      </div>
      <div class="modal-body">
        <form action="../php/login.php" method="POST">
          <div class="input-group mb-2">
            <div class="input-group-prepend">
              <div class="input-group-text"><i class="fa fa-user"></i></div>
            </div>
            <input class="form-control" type="text" name="login" placeholder="Login">

          </div>

          <div class="input-group mb-2">
            <div class="input-group-prepend">
              <div class="input-group-text"><i class="fa fa-lock"></i></div>
            </div>
            <input type="password" class="form-control" name="Senha" placeholder="Senha">
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-dark" data-dismiss="modal" data-toggle="modal" data-target="#cadastroModal">
                                    Cadastrar-se
                                </button>
            <button type="submit" class="btn btn-primary" value="entrar" name="entrar">Entrar</button>
          </div>

        </form>
      </div>

    </div>
  </div>
</div>

    <?php
session_start([

]);

if(isset($_POST['entrar'])){
    $conexao= mysqli_connect("localhost","root","","restaurante");
    mysqli_set_charset($conexao,"utf8");


    $login = $_POST['login'];
    $pass = $_POST['Senha'];


    $sql = "SELECT * FROM usuario WHERE Login='$login' AND Senha='$pass'";
    $result = mysqli_query($conexao,$sql);
    $regis = mysqli_num_rows($result);
    if($regis > 0){
        $_SESSION['login'] = $login;
        echo "Entrou";
        header('Location: ../php/page2.php');
    }else{
        echo "Não entrou na conta";

    }
}

?>

Answer 1

To pass this to ajax you will need the following changes:

HTML: I only put id in the fields

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header amigo">
        <h5 class="modal-title" id="exampleModalLabel">Login</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <form action="../php/login.php" method="POST">
          <div class="input-group mb-2">
            <div class="input-group-prepend">
              <div class="input-group-text"><i class="fa fa-user"></i></div>
            </div>
            <input class="form-control" type="text" id ="login" name="login" placeholder="Login">
          </div>
          <div class="input-group mb-2">
            <div class="input-group-prepend">
              <div class="input-group-text"><i class="fa fa-lock"></i></div>
            </div>
            <input type="password" class="form-control" id="senha" name="Senha" placeholder="Senha">
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-dark" data-dismiss="modal" data-toggle="modal" data-target="#cadastroModal">
                Cadastrar-se
            </button>
            <button type="submit" class="btn btn-primary" value="entrar" id="entrar"name="entrar">Entrar</button>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>

jQuery: take the click of the login button and send by ajax.

$('#entrar').click(function () {
    var dados = {
        'login': $('#login').val(),
        'senha': $('#senha').val()
    };

    $.ajax({
        type: 'POST',
        url: exemplo.com,
        data: dados,
        success: function (data) {},
        error: function (data) {}
    })
});

AJAX: I made few changes to your code

<?php
session_start([

]);

if(isset($_POST)){
    $conexao= mysqli_connect("localhost","root","","restaurante");
    mysqli_set_charset($conexao,"utf8");

    $login = $_POST['login'];
    $pass = $_POST['Senha'];

    $sql = "SELECT * FROM usuario WHERE Login='$login' AND Senha='$pass'";
    $result = mysqli_query($conexao,$sql);
    $regis = mysqli_num_rows($result);

    if($regis > 0){
        $_SESSION['login'] = $login;
        echo json_encode($_SESSION['login']);
    }
    else{
        echo json_encode('Não entrou na conta');
    }
}

?>

Note: if you want to implement something in js when lgoar can be done in Success, I hope to have helped.