2

Queria emitir a mensagem de sucesso ou erro após o cadastro de produtos do meu site na mesma pagina, sem carregar uma nova em branco com a mensagem, eu vi perguntas similares, algumas utilizando ajax que não aprendi nada ainda e não consegui solucionar meu problema com os tópicos que encontrei aqui.

Cadastro de Categoria:

<form method="post" action="gravacategoria.php">
<div class="container">
<div class="form-group">
    <label class="col-md-4 control-label" for="txtproduto">Nova Categoria: </label>  
    <div class="col-md-6">
    <input id="txtcategoria" name="txtcategoria" type="text" class="form-control input-md" required="">
    </div>
</div>
<div class="form-group">
  <label class="col-md-4 control-label" for="btnsalvar"></label>
  <div class="col-md-8">
    <button id="btnsalvarcat" name="btnsalvar" type="Submit" class="btn btn-primary">Salvar</button>
    <button id="btncancelar" name="btncancelar" class="btn btn-danger">Cancelar</button>
  </div>
</div>
</div>
</form>

GravaCategoria:

<?php
    $conn= new PDO("mysql:host=localhost:3306;dbname=loja","root","aula");

    #$idcategoria=$_POST["txtid"];
    $nomecat=$_POST["txtcategoria"];

    $stmt = $conn->prepare('Insert into loja.categoria(nome)Values(:par_categoria)');

    #$stmt->bindValue(1,$idcategoria);
    $stmt->bindValue(2,$nomecat);     

    $dados=array(":par_categoria"=>$nomecat);

    $result = $stmt->execute($dados);

    if($result){
        echo ("Produto inserido com sucesso");
    }
    else{
        echo("Erro");
    }

Obrigado!

1
  • 1
    Bom, a solução é, de fato, com AJAX. Comece estudando-o. Há funções como o fetch do JavaScript ou bibliotecas como JQuery, Axios, entre outros, que poderão facilitar sua vida. Boa sorte.
    – Woss
    Commented 21/11/2019 às 13:20

3 Respostas 3

3

Uma solução simples é mandar os dados para um iframe na mesma página. Basta colocar na página:

<iframe name="gravar" style="display: none;"></iframe>

E no form colocar um target apontando para o name do iframe:

<form target="gravar" method="post" action="gravacategoria.php">
         ↑

No PHP, no lugar do echo você chama um script com o alert da mensagem, mas antes é preciso fazer um if para verificar se o $_POST não está vazio:

<?php
$nomecat=$_POST["txtcategoria"];

if(!empty($nomecat)){
    $conn= new PDO("mysql:host=localhost:3306;dbname=loja","root","aula");

    #$idcategoria=$_POST["txtid"];

    $stmt = $conn->prepare('Insert into loja.categoria(nome)Values(:par_categoria)');

    #$stmt->bindValue(1,$idcategoria);
    $stmt->bindValue(2,$nomecat);     

    $dados=array(":par_categoria"=>$nomecat);

    $result = $stmt->execute($dados);

    if($result){
        $mensagem = "Produto inserido com sucesso";
    }
    else{
        $mensagem = "Erro";
    }
?>
<script>
alert("<?php echo $mensagem ?>");
</script>
<?php    
}
?>
10
  • Obrigado Sam, está bem melhor assim. Seria muito complicado para a mensagem ser exibida dentro form que estão os botoes cancelar e de salvar? Commented 21/11/2019 às 15:38
  • De nada. Cara, dá pra fazer a mensagem como vc quer. Basta usar parent no script do iframe, algo como parent.document.getElementById("msg").innerHTML = "<?php echo $mensagem ?>";, onde msg seria o id de algum elemento que receberia a mensagem, por exemplo: <div id="msg"></div>
    – Sam
    Commented 21/11/2019 às 15:49
  • Estou usando <iframe name="gravar" style="display: none;"></iframe> do jeito que estava, depois no script do gravacategoria, subistitui o alert por isso : if($result){ $mensagem = "Produto inserido com sucesso"; } else{ $mensagem = "Erro"; } ?> <script> parent.document.getElementById("msgaqui").innerHTML = "<?php echo $mensagem ?>"; </script> E acrescentei <div id="msg"></div> dentro do meu form de cadastro de categorias logo abaixo dos botoes. porem continua uma mensagem box na tela Commented 21/11/2019 às 16:02
  • Continua o alert? Não era pra aparecer mais já que vc retirou ele.
    – Sam
    Commented 21/11/2019 às 16:05
  • Deu certo amigo, muito obrigado Commented 21/11/2019 às 16:09
2

Realmente com o ajax e json seria bem legal, também.

Dá uma olhada

Nessa página estou usando o bootstrap, é só o html, mas usar os seguintes códigos separados:

HTML, JS e PHP

HTML

const msgArr = [
{title: 'Success', msg: 'Salvo com sucesso'},
{title: 'Error', msg: 'Falha ao tentar salvar'},
]

 $('#btnsalvarcat').on('click',function(e){
     e.preventDefault()
     salvarDados()
 })

salvarDados = () =>{
   const idx = getRandomIntInclusive( 0, 1 )
   alert( msgArr[ idx ].msg)
}




function getRandomIntInclusive(min, max) {
  min = Math.ceil(min);
  max = Math.floor(max);
  return Math.floor(Math.random() * (max - min + 1)) + min;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
  
  
  <form method="post" action="gravacategoria.php">
<div class="container">
<div class="form-group">
    <label class="col-md-4 control-label" for="txtproduto">Nova Categoria: </label>  
    <div class="col-md-6">
    <input id="txtcategoria" name="txtcategoria" type="text" class="form-control input-md" required="">
    </div>
</div>
<div class="form-group">
  <label class="col-md-4 control-label" for="btnsalvar"></label>
  <div class="col-md-8">
    <button id="btnsalvarcat" name="btnsalvar"  class="btn btn-primary">Salvar</button>
    <button id="btncancelar" name="btncancelar" class="btn btn-danger">Cancelar</button>
  </div>
</div>
</div>
</form>

No seu javascript voce poderia usar assim:

 salvarDados = () => {
    $.ajax({
      url: 'gravacategoria.php',
      type: 'post',
      dataType: 'json',
      data: {
         txtcategoria: $('#txtcategoria').val()
      }
   }).then( r =>{ // o r é o retorno do php
        if(r.status == true){
          alert('Salvo com sucesso!')
        }else{
          alert('Falha ao salvar!')

        }
    })
}

No php

<?php
$nomecat=$_POST["txtcategoria"];

if(!empty($nomecat)){
    $conn= new PDO("mysql:host=localhost:3306;dbname=loja","root","aula");

    #$idcategoria=$_POST["txtid"];

    $stmt = $conn->prepare('Insert into loja.categoria(nome)Values(:par_categoria)');

    #$stmt->bindValue(1,$idcategoria);
    $stmt->bindValue(2,$nomecat);     

    $dados=array(":par_categoria"=>$nomecat);

    $result = $stmt->execute($dados);

    if($result){
        $t = array('status' = true);
        echo json_encode(  $t );
    }
    else{
        $t = array('status' = false);
        echo json_encode(  $t );
    }
?>

}
?>

Quem vai retornar para o ajax é o json encode, onde dentro dele você coloca o array

Essa é a sugestão e é assim que funciona o ajax

2
  • Obrigado pela dica, porem para poder usar eu preciso estuar ajax, muita coisa que não entendo Commented 21/11/2019 às 17:06
  • Ficou legal a solução.
    – Sam
    Commented 21/11/2019 às 19:04
-1

formulario.php:

    <form method="post" action="gravacategoria.php">
       <div class="container">
          <div class="form-group">
             <label class="col-md-4 control-label" for="txtproduto">Nova Categoria: </label>  
             <div class="col-md-6">
                <input id="txtcategoria" name="txtcategoria" type="text" class="form-control input-md" required="">
             </div>
          </div>
          <div class="form-group">
             <label class="col-md-4 control-label" for="btnsalvar"></label>
             <div class="col-md-8">
                <button id="btnsalvarcat" name="btnsalvar" type="Submit" class="btn btn-primary">Salvar</button>
                <button id="btncancelar" name="btncancelar" class="btn btn-danger">Cancelar</button>
             </div>
             <div>
                <p><?=$_GET['mensagem']?></p>
             </div>
          </div>
       </div>
    </form>

gravacategoria.php:

<?php
$conn= new PDO("mysql:host=localhost:3306;dbname=loja","root","aula");

#$idcategoria=$_POST["txtid"];
$nomecat=$_POST["txtcategoria"];

$stmt = $conn->prepare('Insert into loja.categoria(nome)Values(:par_categoria)');

#$stmt->bindValue(1,$idcategoria);
$stmt->bindValue(2,$nomecat);     

$dados=array(":par_categoria"=>$nomecat);

$result = $stmt->execute($dados);

if($result){
    $mensagem = "Produto inserido com sucesso";
    header("Location: formulario.php?mensagem=$mensagem");
}
else{
    $mensagem = "Erro";
    header("Location: formulario.php?mensagem=$mensagem");
}
1
  • Não é isso que ele quer. Ele não quer recarregar a página.
    – Sam
    Commented 21/11/2019 às 19:05

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .