Ajax表单提交不能在PHP中工作

时间:2017-02-02 11:26:18

标签: php jquery ajax

当我从profiles.php对update.php进行ajax调用时,它会返回一个空白页面update.php,但如果我回到profile.php它确实会进行更改 我错了什么,我错了什么?

  

profile.php

<?php                                                                                                       include_once("includes/config.php");

    if (isset($_GET['id']))

    {

    $Nome = $_GET['id'];

    $sql = "SELECT * FROM utilizadores WHERE id='$Nome'";

    $result = $conn->query($sql);

    if ($result->num_rows > 0) {                                           

    if($row = $result->fetch_assoc()) {

     echo'
     <br>
     <form action="update.php" method="post"  id="go"  class="go" accept-charset="utf-8">
      <div class="content" >
      <div class="container-fluid">
      div class="row">
      <div class="col-md-8">
      <div class="card">
      <div class="header">
      <h4 class="title">Perfil do paciente</h4>
      </div>

       <div class="content">
       <div class="row">
       <div class="col-md-4">
       <div class="form-group">
       <label>Nome</label>
       <input type="text" class="form-control" disabled placeholder="Nome" value="'.$row["Nome"].'">
       </div>
       </div>

        <div class="col-md-4">
        <div class="form-group">
        <label>Apelido</label>
        input type="text" class="form-control" disabled placeholder="Apelido" value="'.$row["Apelido"].'">
         </div>
         </div>

         <div class="col-md-4">
         <div class="form-group">
         <label for="exampleInputEmail1">Email</label>
         <input type="email" class="form-control" name="Email "disabled placeholder="Email" value="'.$row["Email"].'">
          </div>
          </div>
          </div>

          <div class="row">
          <div class="col-md-4">
          <div class="form-group">
           <label>Idade</label>
           <input type="text" class="form-control" disabled placeholder="Idade" value="'.$row["Idade"].'">
           </div>
           </div>

           <div class="col-md-4">
           <div class="form-group">
           <label>Sexo</label>
           <input type="text" class="form-control" disabled placeholder="Sexo" value="'.$row["Sexo"].'">
           </div>
           </div>

           <div class="col-md-4">
           <div class="form-group">
           <label>Telefone</label>
           <input type="text" class="form-control" disabled placeholder="Telefone" value="'.$row["Telefone"].'">
             </div>
             </div>
             </div>

            <div class="row">
            <div class="col-md-3">
            <div class="form-group">
            <label>Peso</label>
            <input type="text" class="form-control" disabled placeholder="Peso" value="'.$row["Peso"].'Kg">
             </div>
            </div>

           <div class="col-md-3">
           <div class="form-group">
           <label>Altura</label>
           <input type="text" class="form-control" disabled placeholder="Altura" value="'.$row["Altura"].'Cm">
           </div>
           </div>
          <div class="col-md-3">
          <div class="form-group">
          <label>Perimetro Abdominal</label>
          <input type="text" class="form-control" disabled placeholder="Perimetro abdominal" value="'.$row["Perimetro_abdominal"].'Cm">
          </div>
          </div>

          <div class="col-md-2">
          <div class="form-group">
          <label>Perimetro Anca </label>
          <input type="text" class="form-control" disabled placeholder="Perimetro Anca" value="'.$row["Perimetro_anca"].'Cm">
            </div>
            </div>
            </div>

            <div class="row">
            <div class="col-md-6">
            <div class="form-group">
            <label>Medicação:</label>
            <textarea rows="3" class="form-control" name="Medicacao" placeholder="Medicação" id="Medicacao">'.$row["Medicacao"].'</textarea>
             </div>

            <input type=hidden name=hidden value="'.$row["id"].' ">
            <input type="submit" name="med" class="btn btn-info btn-fill pull-right" value="Atualizar" id="med"></div>

             <div class="col-md-6">
             <div class="form-group">
             <label>Observações:</label>
             <textarea rows="3" name="Obs"  class="form-control"  placeholder="Anotar observações" id="Obs">'.$row["Obs"].' </textarea>
                                                </div>   

            <input type="submit" name="obs" class="btn btn-info btn-fill pull-right" value="Atualizar">                                        
             </div>
             </div></form>';

              }


                   // Check connection
                   if (mysqli_connect_errno())
                   {
                   echo "Failed to connect to MySQL: " . mysqli_connect_error();
                   }
                   mysqli_close($conn);

                ?>
               <script type="text/javascript">
               $( "#med" ).click(function() {
               $.ajax({
               type: "POST",
               url: "update.php",
              success: function(){
              alertify.success('campo atualizado com sucesso');
              }
              });
              });

</script>
  

update.php

include_once("includes/config.php");

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

 $UpdateQuery = "UPDATE utilizadores SET Medicacao='$_POST[Medicacao]' WHERE id='$_POST[hidden]' ";
 $res = mysqli_query($conn,$UpdateQuery);

 if($res == 1) 
{
  //header('Location: ' . $_SERVER['HTTP_REFERER'],true,  301 );
} 
 ?>

1 个答案:

答案 0 :(得分:0)

处理submit事件时,您没有取消submit按钮的默认click事件。这导致表单以正常方式提交,也可以转到表单action属性中设置的网址。

除此之外,您还需要将数据添加到ajax请求中。

此:

$( "#med" ).click(function() {
    $.ajax({
       type: "POST",
       url: "update.php",
       success: function(){
           alertify.success('campo atualizado com sucesso');
       }
    });
});

应该是:

$( "#med" ).click(function(event) {
    // cancel default submit event
    event.preventDefault();
    $.ajax({
       type: "POST",
       // add data
       data: $('form#go').serialize(),
       url: "update.php",
       success: function(){
           // Do whatever you need to here
           console.log('campo atualizado com sucesso');
       }
    });
});