0

Tenho um sistema onde o administrador pode aprovar ou desaprovar o usuário, já esta tudo pronto, porém quero saber como faço pra fazer esse processo com ajax, para que toda vez que eu aprove ou desaprove um usuário a pagina não dê refresh.

Página de aprovação

    <div class="row">
         <div class="col-md-5"><h3>Autorização de Usuarios</h3></div>
         </div>
  <div class="row alinha-tabela">
    <div class="row">
    <div class="col-md-6">
      <div class="table-responsive shadow-z-1">
        <table class="table table-striped table-condensed table-hover">
         <thead>
           <tr>
             <th>Codigo</th>
             <th>Usuario</th>
             <th>Status</th>
           </tr>
         </thead>
            <tbody>
              <?php  
                //Consulta
                $buscarusuario=$pdo->prepare("SELECT * FROM usuario");
                $buscarusuario->execute();

                //atribuindo dados á variavel
                $linha = $buscarusuario->fetchAll(PDO::FETCH_ASSOC);

                //percorrendo a variavel para listar os dados
                foreach ($linha as $listar) {
                    $iduser = $listar['id'];
                    echo "<tr>";
                    echo " <td>".$listar['id']."</td>";
                    echo "<td>".$listar['nome']."</td>";
                    if($listar['status'] > 0 ){
                    echo "<td class='success text-success'>Aprovado 
  <form method='post' action='pg/mudastatus.php' id='f-desaprova' class='form-muda'>
      <button type='submit' class='btn btn-xs btn-success alinha-btn' name='desaprova' value='$iduser'>Desaprovar</button>
</form>
                    </td>";
                  }else{
                    echo "<td class='danger text-danger'> Aguardando aprovação 
  <form method='post' action='pg/mudastatus.php' id='f-aprova' class='form-muda'>
   <button type='submit' class='btn btn-xs btn-danger alinha-btn' name='aprova' value='$iduser' >Aprovar</button>
</form>

                    </td>";
                  } 
  }
              ?>
            </tbody>
        </table>
      </div>
    </div>

mudastatus.php

    <?php
 include '../config/config.inc.php'; 


if(isset($_POST['aprova'])){

   $atualizarstatus = $pdo->prepare("UPDATE usuario SET status=1 WHERE id=:ID ");
   $atualizarstatus->bindValue(":ID",$_POST["aprova"]);
   $atualizarstatus->execute();
   $linha = $atualizarstatus->rowCount();

   if($linha > 0){
     header("location:../logado.php");
   }else{
    echo "Erro ao Mudar status";
   }
}elseif (isset($_POST['desaprova'])){

   $atualizarstatus = $pdo->prepare("UPDATE usuario SET status=0 WHERE id=:ID ");
   $atualizarstatus->bindValue(":ID",$_POST["desaprova"]);
   $atualizarstatus->execute();
   $linha = $atualizarstatus->rowCount();

   if($linha > 0){
     header("location:../logado.php");
   }else{
    echo "Erro ao Mudar status";
    header("location:../logado.php");
   }
}

2 Respostas 2

0

Eu não poderei de ajudar com a parte do PHP, mas vou tentar de dá uma orientação quando a requisição AJAX.

primeiro, tente colocar todos os inputs que você planeja receber no servidor dentro de um form

vamos pegar como exemplo o seguinte mark-up html.:

<form id="formulario" action="atualiza.php" method="POST">
  <div>
    <label>
      Autor:
      <input id="Author" name="Author" type="text" />
    </label>
  </div>
  <div>
    <label>
      Data Referencia:
      <input id="DataReferencia" name="DataReferencia" type="text" />
    </label>
  </div>
  <div>
      <label>
      Registos 01:
      <input id="Registos_1" name="Registos[]" type="text" />
    </label>
  </div>
  <div>
      <label>
      Registos 02:
      <input id="Registos_2" name="Registos[]" type="text" />
    </label>
  </div>
  <div>
      <label>
      Registos 03:
      <input id="Registos_3" name="Registos[]" type="text" />
    </label>
  </div>
  <div>
    <input id="Enviar" type="submit" value="Value" />
  </div>
</form>

acredito que você está familiarizado com o código acima, e sabe como recuperar os campos Autor, DataReferencia e Registos[] quando os mesmos chegam ao seu servidor.

A forma como você vai recuperar os dados no servidor não vai mudar, o que vai mudar é a forma como enviar os dados e recuperar os mesmos.

para tal, te aconselho a manipular o evento submit do form#formulario

var formulario = document.getElementById("formulario");
formulario.addEventListener("submit", function (event) {
  // cancelando o envio sincrono do formulario.
  event.preventDefault();

  var data = new FormData(formulario);
  var httpRequest = new XMLHttpRequest(formulario.method, formulario.action, true);
  httpRequest.open();
  httpRequest.addEventListener("readystatechange", function (event) {
    if (httpRequest.readyState == 4) {
      if (httpRequest.status == 200) {
        // a requisição ajax deu certo
        console.log(httpRequest.response);
      } else {
        // ocorreu um erro durante a requisição AJAX.
        console.error(httpRequest.statusText);
      }
    }
  });
  httpRequest.send(data);
});

no seu código PHP você tem duas opções, retorna uma string com uma HTML já montado e substituir o HTML da pagina, ou retornar um objeto JSON e usar ele para manipular a sua pagina.

Em ambos os casos, você vai precisar setar uma propriedade responseType do seu httpRequest e manipular o retorno da seguinte forma:

Text/HTML

// antes de enviar
httpRequest.responseType = "text";

// ao receber a resposta com sucesso.:
// limpando o DOM que vai receber o novo conteudo.
var destino = document.getElementById("destino");
while (destino.firstChild) {
  destino.removeChild(destino.firstChild);
}  

// montando o novo conteudo.
var parser = new DOMParser();
var node = parser.parseFromString(xmlHttp.responseText, "text/html");
destino.appendChild(node.documentElement);

JSON

// antes de enviar
httpRequest.responseType = "json";

// ao receber a resposta com sucesso.:
// digamos que você passou o seguinte json.:
// { novoValor: 'Hello World' }.
var destino = document.getElementById("destino");
var campo = destino.querySelector("#id_campo");
campo.value = xmlHttp.response.novoValor;

quanto a retornar um JSON no PHP, você pode converter o seu objeto da seguinte forma:

echo json_encode($meu_objeto);
0

Caso você for usar jQuery, você fazer da seguinte maneira:

$.ajax({
    type: 'POST',
    data: {
        aprova: true,
    },
    url: 'mudastatus.php',
    success: function(data){
       alert('ok');
    }

});

Porém tem alguns outras coisas que você precisa arrumar em seu código.

  1. Não tem necessidade do uso do método header, já que você não irá redirecionar para lugar nenhum o ajax.
  2. Você não precisa colocar dois parâmetros no $_POST, um aprova e outro desaprova, você pode colocar apenas um, por exemplo status, se status for aprovado, executa tal ação, se for desaprovado executa outra ação. Mais limpo, certo?
1
  • olá amigo poderia me explicar mais detalhado como ficaria meu codigo com o ajax e deixalo mais limpo sem dois form ? Commented 6/07/2016 às 22:07

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 .