AJAX request for PHP page is not sent

Asked

Viewed 75 times

-2

Good night ,

Guys, my page 'l_os' lists and changes all items on another page correctly. Only that I am changing all pages to display and change through a single page to index.Ai enters the ajax , in my index I present the page that lists all the items that when clicking on the action change the ajax calls the page that changes and displays the values in the fields. The problem is when I click on change the value is going wrong to ajax presenting another value in the fields is only the first line that I can click the other does not happen anything.

Since I put the parameters in ajax to be able to recover the values in the page that changes, it is not working properly , I believe that ajax is only taking a row of my independent list in which row of the table I click to change.

If anyone can help me, I’d really appreciate it.

Page 'l_os'

    <!DOCTYPE html>
<html lang="pt-br">
<head>
  <head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
  <title>Cadastro Funcionario</title>

  <!-- Bootstrap -->
  <link href="style/css/bootstrap.min.css" rel="stylesheet">
  <link type="text/css" href="style/css/style.css" rel="stylesheet">
  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
      <![endif]-->
    </head>

<body>


<div class="container-fluid">
       <div class="page-header">
         <h3>Consulta Ordem de Serviço</h3> 
       </div>
       <div class="">
             <a href="#" id="cadastro_os" class="btn btn-default btn-cadastrar-btn">Incluir OS</a>
       </div>
       <table style="width: 450px" class="table table-striped table-bordered table-hover table-condensed table-responsive " >

         <thead >
           <th> Prótocolo</th>          
           <th> Funcionario</th> 
           <th>  Cliente</th> 
           <th>  Email</th> 
           <th>  Telefone</th> 
           <th>  Celular</th> 
           <th>  CPF</th> 
           <th>  Cidade</th> 
           <th> Endereço</th> 
           <th> Serviço</th> 
           <th>  Situacao</th> 
           <th>  Data_OS</th> 
           <th colspan="2"> Ações</th> 
         </thead>

         <tbody >
           <?php

           $CODAO = new OsDAO();
           $query = $CODAO->listar_os();
          foreach($query as $reg):  
           ?>

          <tr class="success largura">
          <td> <?=$reg["id_protocolo"] ?></td>
          <td> <?=$reg["nome_funcionario"] ?></td>
          <td> <?=$reg["nome"] ?></td>
          <td> <?=$reg["email"] ?></td>
          <td> <?=$reg["telefone"] ?></td>
          <td> <?=$reg["telefone_celular"] ?></td>
          <td> <?=$reg["cpf"] ?></td>
          <td> <?=$reg["cidade"] ?></td>
          <td > <?=$reg["endereco"] ?></td>
          <td > <?=$reg["nome_servico"] ?></td>
          <td > <?=$reg["situacao"] ?></td>
          <td > <?=date("d/m/Y H:i:s", strtotime($reg["data_os"])); ?></td>

          <td >
             <center>
                //id para o ajax ativar a função clicar
             <a id="alterar_os" href="#" class="btn btn-default">Alterar</a>
             </center>

           </td>
          </tr>


        </tbody>
      <script type="text/javascript">
    $(document).ready(function(){
        $('#cadastro_os').click(function(){//essa parte do ajax funciona perfeito para incluir
           $( "#cliente1" ).load( "os/c_os.php" );
        });
        $('#alterar_os').click(function(){
           $( "#cliente1" ).load( "os/a_os.php?IDCLI=<?=$reg["id_cliente"];?>&IDFUN=<?=$reg["id_funcionario"];?>&IDSER=<?=$reg["id_servico"];?>&IDOS=<?=$reg["id_protocolo"];?>" );
        });

   });
    </script>
      <?php   
      endforeach;
      ?>
      </table>

</div>
</body>


<script src="style/js/bootstrap.min.js"></script>
</body>
</html>
php ajax

  • No way. Try to use a script to send the request. Then pull the ajax. Give a number to each field to load. And pass the onclick the line number that will pull the fields.

1 answer

1


1. There are two tags <head> in the code, delete a.

2. You are finalizing the instruction foreach PHP in the wrong place. You should finish it as soon as you complete the table row, indicated by tag </tr>.

<table style="width: 450px" class="..." >
  <thead >
    <th>Protocolo</th>          
    <th>Funcionario</th> 
    <th>Cliente</th> 
    <th>Email</th> 
    <th>Telefone</th> 
    <th>Celular</th> 
    <th>CPF</th> 
    <th>Cidade</th> 
    <th>Endereço</th> 
    <th>Serviço</th> 
    <th>Situacao</th> 
    <th>Data_OS</th> 
    <th colspan="2">Ações</th> 
  </thead>

  <tbody >
    <?php
      $CODAO = new OsDAO();
      $query = $CODAO->listar_os();

      foreach($query as $reg):
    ?>
    <tr class="success largura">
      <td><?= $reg["id_protocolo"]; ?></td>
      <td><?= $reg["nome_funcionario"]; ?></td>
      <td><?= $reg["nome"]; ?></td>
      <td><?= $reg["email"]; ?></td>
      <td><?= $reg["telefone"]; ?></td>
      <td><?= $reg["telefone_celular"]; ?></td>
      <td><?= $reg["cpf"]; ?></td>
      <td><?= $reg["cidade"]; ?></td>
      <td><?= $reg["endereco"]; ?></td>
      <td><?= $reg["nome_servico"]; ?></td>
      <td><?= $reg["situacao"]; ?></td>
      <td><?= date("d/m/Y H:i:s", strtotime($reg["data_os"])); ?></td>
      <td>
        <center>
          <a id="alterar_os" href="#" class="btn btn-default">Alterar</a>
        </center>    
      </td>
    </tr>
    <?php endforeach; ?>
  </tbody>

3. For your Javascript code, to edit the record, you need the values of id_cliente, id_funcionario, id_servico and id_protocolo. This data we need to get inside our PHP loop and somehow associate to link Change. For this we can store the URL in an extra attribute, which I will call data-url.

<a href="#" data-url="os/a_os.php?IDCLI=<?=$reg["id_cliente"];?>&IDFUN=<?=$reg["id_funcionario"];?>&IDSER=<?=$reg["id_servico"];?>&IDOS=<?=$reg["id_protocolo"];?>" class="btn btn-default alterar_os">Alterar</a>

Notice that I changed the id of tag a for class alterar_os. Doing this is necessary because the attribute id should be unique on the page. As there will be multiple records, it is necessary to position the identifier for the class.

4. Now, in Javascript, to make the AJAX request, just resume the value of the attribute data-url of the pressed element and make the request on it.

<script type="text/javascript">
  $(document).ready(function(){
    ...
    $('.alterar_os').click(function(){
      $("#cliente1").load($(this).attr("data-url"));
    });
  });

Also note how it was changed from id for class link identifier, in jQuery, the selector passed from #alterar_os for .alterar_os.

I just don’t know where the element #cliente1, where the content will be loaded, it is in your HTML page.

  • Thank you very much Anderson.For your answer you understood my doubt perfectly. The #cliente1 element is where the page 'l_os' na' index 'will be loaded. This way of creating an attribute and assigning the path with the values will help me a lot in other cases.It perfectly solved my problem

Browser other questions tagged php ajax

You are not signed in. Login or sign up in order to post.