Partage d'expérience d'utilisation de ThinkPHP - ThinkPHP Ajax réalise un menu déroulant de liaison à 2 niveaux

Le premier est la conception de la base de données. La table de classification s'appelle cate.

Ce que je fais est le couplage de deuxième niveau des données classifiées. Les champs requis pour les données sont : id, name (nom chinois), pid (id parent).

Paramètres de l'identifiant parent : si les données n'ont pas de niveau supérieur, l'identifiant parent est 0. S'il existe un niveau supérieur, l'identifiant parent est l'identifiant du niveau supérieur.

Une fois que la base de données a du contenu, vous pouvez commencer à écrire du code pour implémenter une liaison secondaire.

Récupérez d'abord toutes les données avec le pid 0 dans le php d'arrière-plan, enregistrez-les dans $cate, puis utilisez une boucle foreach pour les afficher dans 221f08282418e2996498697df914ce4e de la première couche.

Code HTML :

<select name="type" size="1" id="type">
    <option>请选择类型</option>
     <foreach name=&#39;cate&#39; item=&#39;v&#39;>
         <option value="{$v[&#39;ca_id&#39;]}">{$v.ca_name}</option>
     </foreach>
 </select>
 标签：
 <select name="lable" size="1" id="lables">
 </select>

Code Ajax :

  $('#type').click(function(){
            $(this).change(function(){
                var objectModel = {};
                var   value = $(this).val();
               var   type = $(this).attr('id');
                objectModel[type] =value;
                $.ajax({
                    cache:false,
                    type:"POST",
                    url:site.web+"lable",
                    dataType:"json",
                    data:objectModel,
                    timeout:30000,
                    error:function(){
                        alert(site.web+"lable");
                    },
                    success:function(data){
                        $("#lables").empty();
                        var count = data.length;
                        var i = 0;
                        var b="";
                           for(i=0;i<count;i++){
                               b+="<option value=&#39;"+data[i].ca_id+"&#39;>"+data[i].ca_name+"</option>";
                           }
                        $("#lables").append(b);
                    }
                });
               });
        }
    );

Le code Ajax est déclenché après la modification du premier type de couche. Les principaux paramètres de la méthode ajax sont.

1.url : L'adresse où l'ajax est reçu en arrière-plan

2.data : Les données transmises en arrière-plan sont généralement transmises en json ; valeur de la classe sélectionnée.

3.type : méthode de transfert, il existe des méthodes get et post. J'utilise généralement post, qui peut transmettre plus de données que get, et est plus sécurisée ;

4.erreur : exécution ajax ; Méthode d'échec ;

5.success : méthode d'exécution Ajax, qui est la fonction de rappel. Lors de l'exécution réussie ici, j'utilise d'abord empty() pour effacer le contenu du deuxième menu déroulant, puis j'affiche les données obtenues en arrière-plan.

Ce qui suit est la page où Thinkphp reçoit et traite les données ajax

//后台ajax验证
  $result = array();
  $cate =$_POST['type'];
  $result = M('cate')->where(array('ca_pid'=> $cate))->field('ca_id,ca_name')->select();
  $this->ajaxReturn($result,"JSON");

La méthode I() de Thinkphp peut en fait être considérée comme $_POST[], afin d'obtenir la première couche passée par ajax Sélectionnez l'identifiant du contenu, puis récupérez sa sous-classe, puis utilisez ajaxReturn() pour le renvoyer à ajax. Les données de retour sont définies sous forme json, donc ajax recevra les données sous forme json

. Méthode de retour des données PHP natives :

   //搜索结果为$result
   .....
   echo json_encode($result);

Ceci termine la mise en œuvre du menu déroulant de liaison à deux niveaux. Il convient de noter que l'URL doit être correcte et qu'il doit y avoir une valeur de retour une fois reçue. en arrière-plan, sinon ajax n'exécutera pas la méthode success de.

Pour plus de partage de l'expérience d'utilisation de ThinkPHP - ThinkPHP Ajax réalise un menu déroulant de liaison à 2 niveaux et des articles connexes, veuillez faire attention au site Web PHP chinois !