Méthode de mise à jour de l'état des données locales en combinant ajax, mysql et smarty

État de l'effet : le verrouillage de l'état peut être basculé entre verrouillé et non verrouillé en cliquant

1.Programme principal : 01.php importe les classes smarty et mysql, obtient les données et les importe dans le modèle de liste

<?
  include './include/Mysql.class.php';
  include './libs/Smarty.class.php';
  $db=new Mysql;
  $smarty=new Smarty;
  $lists=$db->getALL('users');
  $smarty->assign('lists',$lists);
  $smarty->display('list.html');
?>

2.Le modèle de liste utilise smarty pour parcourir les données du modèle et les afficher, appelant ajax pour changer l'état de verrouillage

!DOCTYPE html>
<html>
<head>
  <meta charset=utf-8>
  <title>Tableau de visualisation des droits d'utilisateur</title>
</head>
<body>
    <table align="center" border="1" width="500">
      <center><h2>Tableau des droits d'utilisateur</h2></center>
      <tr>
        <th>uid</th><th>Nom d'utilisateur</th><th>Mot de passe</th><th>État de verrouillage</th><th>Rôle</th>
      </tr>  
      {foreach $lists as $list}
        <tr align="center">
          <td>{$list.uid}</td>
          <td>{$list.username}</td>
          <td>{$list.password}</td>
          {if $list.is_lock==1}
            <td><a href="javascript:lock(0,{$list.uid});" rel="external nofollow" >Verrouiller</a></td>
            {else}
            <td><a href="javascript:lock(1,{$list.uid})" rel="external nofollow" ;>Annuler le verrouillage</a></td>  
          {/if}    
          {if $list.role==1}
              <td>Administrateur</td>
          {else}
              <td>Éditeur</td>    
          {/if}
        </tr>    
      {/foreach}  
    </table>  
</body>
    <script type="text/javascript">
      function lock(lock,uid){
          //Créer un objet AJAX
          var xhr=new XMLHttpRequest();
          //Ouvrir un lien
          xhr.open('get','02.php?is_lock='+lock+"&uid=]}+uid);
          //Envoyer une requête AJAX
          xhr.send(null);
          //Définir les fonctions de rappel, écouter les fonctions
          xhr.onreadystatechange=function(){
            //Si le code de réponse de l'AJAX est normal et que le réseau est normal, obtenir le texte de réponse
            if(xhr.readyState==4&&xhr.status==200){
              if(xhr.responseText){
                window.location.reload();
              }
                alert("Échec du basculement d'état !");
              }
            }
          }
        }
    </script>
</html>

3.script de réponse AJAX, recevant des données transmises par AJAX via GET pour modifier le contenu de la base de données et renvoyer un texte à la boucle de script JS

<?
  include './include/Mysql.class.php';
  $lock=$_GET['is_lock'];
  $uid=$_GET['uid'];
  $db=new Mysql;
  $result=$db->update('users',"is_lock=$lock","uid=$uid");
  if($result){
    echo true;
  }
    echo false;
  }
?>

C'est tout ce que je partage avec vous aujourd'hui sur la méthode de mise à jour de l'état de données locale en combinant AJAX, base de données MySQL et smarty. J'espère que cela vous donnera une idée et que vous soutenerez davantage les tutoriels de cri.

Déclaration : Le contenu de cet article est extrait du réseau, propriété du propriétaire original, contribué et téléchargé par les utilisateurs d'Internet, ce site n'en possède pas la propriété, n'a pas été édité par l'homme, et n'assume pas la responsabilité des responsabilités juridiques associées. Si vous trouvez du contenu suspect de violation de copyright, veuillez envoyer un e-mail à : notice#oldtoolbag.com (veuillez remplacer # par @ lors de l'envoi d'un e-mail pour signaler une violation et fournir des preuves. Une fois vérifié, le site supprimera immédiatement le contenu présumé de violation de droit d'auteur.).

Tutoriel de base