Pop-up message after submitting a form with php

Bruno Reis

I'm trying to get a pop-up message saying if it was successfully submitted or not without having to go to a different page.

Now chrome gives me the pop-up message but it redirects me to a blank page after.

Here is my current code.

<?php
include "header.php";
include "conexao.php";
echo "<h1 align='center'>Pagina para alterar produtos</h1><div class='container'><hr>";
$referencia=$_GET['id'];


$sql = "SELECT * ";
        $sql = $sql . " FROM tb_produto ";
        $sql = $sql . " WHERE pr_codigo='".$referencia."'";
        $produtos = $db->query($sql);
        foreach ($produtos as $produto) {
            $referencia = $produto["pr_codigo"];
            $nome = $produto["pr_descricao"];
            $preco = $produto["pr_preco"];
            $disponivel = $produto["disponivel"];
        }
        echo "<h2>Referencia: ".$referencia."</h2>";
        echo "<h2>Nome: ".$nome."</h2><hr>";

?>
<form action="confirmaAlterar.php">
<div class="form-group">
<label>Referencia</label>
    <input class="form-control" type="text" name="referencia" value="<?php echo $referencia?>">
</div>
<div class="form-group">
<label>Nome</label>
    <input class="form-control" type="text" name="nome" value="<?php echo $nome?>">
</div>
<div class="form-group">
<label>Preço</label>
    <input class="form-control" type="text" name="preco" value="<?php echo $preco?>">
</div>
<button class="btn btn-primary">Alterar</button>
</form>

Here is where it submits the information of the form.

<?php
include "header.php";
include "conexao.php";
$nome=$_GET['nome'];
$referencia=$_GET['referencia'];
$preco=$_GET['preco'];
$sql="UPDATE tb_produto SET pr_descricao='".$nome;
$sql.="', pr_preco=".$preco;
$sql.= " WHERE pr_codigo='".$
try{
    $comando=$db->prepare($sql);
    $comando->execute();
    echo "<script type='text/javascript'>alert('submitted successfully!')</script>";
    header( "refresh2;Location:index.php" );
}
catch (PDOException $e){
    echo "A";
}

Stefan Michelangelo Mihajlovic

To pass values using ajax. Form:

<form id="form">
<input type="text" value="test" name="akcija"> 
</form>

All inputs fields values in your form will be passed.

Ajax:

jQuery(function(){
$('#form').on('submit', function (e) { //on submit function
    e.preventDefault();
    $.ajax({
      type: 'post', //method POST
      url: 'yoururl.php', //URL of page where u place query and passing values
      data: $('#form').serialize(), //seriallize is passing all inputs values of form
      success: function(){ //on success function
              $("#input").attr("disabled", true); //example
              $("#input").removeClass('btn-primary').addClass('btn-success');//example
                  },
    });
}
});

And on the ajax page you can get values by