Notes pratiques du projet de blog [laravel] - création de listes de classification multi-niveaux en arrière-plan et modification asynchrone Ajax du tri de classification

Je veux toujours faire un petit projet par moi-même, mais je ne sais pas par où commencer. Je fais toujours une certaine partie du projet quand je vais travailler, et je ne fais pas un projet dans son ensemble. sont les notes que j'ai compilées après avoir regardé la vidéo sur le site Web chinois php, pour votre référence. Il s'agit d'un projet de blog pratique réalisé dans un environnement Windows. Les articles suivants font partie du projet. Je les ai partagés section par section. Si vous voulez en voir plus, suivez-moi et je continuerai à mettre à jour.

1. Liste de classification à plusieurs niveaux sur la page de classification de l'article d'arrière-plan

1) Ajoutez une classification à plusieurs niveaux. Notez que cate_pid et cate_id sont les mêmes pour prouver dans quelle catégorie il se trouve

2) Ajoutez une méthode pour. traiter la classification

public function getTree(){
}

3) Ci-dessus Ajustez la méthode suivante dans la méthode

$data = $this->getTree($categroy);
public function index(){
$categroy = CategroyModel::all();
$data = $this->getTree($categroy,'cate_name','cate_pid','cate_id');
return view('home/categroy/index')->with('data',$data);
}

4) Imprimez ci-dessous pour voir si les paramètres ci-dessus sont transmis

public function getTree($data){
dd($data);
}

5) Filtrez d'abord ceux dont cate_pid est 0, puis faites un nouveau cycle pour filtrer ceux dont cate_pid et cate_id sont égaux. Afin de laisser La méthode est plus puissante, nous avons pensé à utiliser la méthode de passage de paramètres,

public function getTree($data,'$file_pid=‘pid’,$file_id=‘id’,$pid=0){
     $arr = array();
   foreach($data as $key =>$value){
if($value->$file_pid==$pid){
$data[$key]["_cate_name"]=$data[$key]["cate_name"];
$arr[] = $data[$key];
foreach($data as $k=>$v{
                    if($value->$file_pid==$v->$file_id){
      //新定义个字段把分类的下级定义出来
$data[$k]["_cata_name"]='-->'.$data[$k]["cate_name"]
$arr[]=$data[$v];
}
       }
      }
   }

Meilleure optimisation du code :

Mettre le processus d'organisation des données dans le contrôleur dans le modèle

public static function tree(){   //用的是静态方法
$categroy =  CategroyModel::all();
return （new CategroyModel）->getTree($categroy,'cate_name','cate_pid','cate_id');
}
public function tree(){
$categroy = $this->all();
return $this->getTree($categroy,'cate_name','cate_pid','cate_id');
}
public function getTree($data,'$file_pid=‘pid’,$file_id=‘’,$pid=0){
$arr = array();
foreach($data as $key =>$value){
if($value->$file_pid==$pid){
$data[$key]["_cate_name"]=$data[$key]["cate_name"];
$arr[] = $data[$key];
foreach($data as $k=>$v{
if($value->$file_pid==$v->$file_id){
//新定义个字段把分类的下级定义出来
$data[$k]["_cata_name"]='-->'.$data[$k]["cate_name"]
$arr[]=$data[$v];
}
}
}
}

Modifications dans le contrôleur :

public function index(){
// $data= CategroyModel::Tree();   不是静态方法不能用静态方法调用   调用静态方法
$data =(new CategroyModel)->Tree();   调用不是静态方法
return view('home/categroy/index')->with('data',$data);
}

2. Ajax modifie de manière asynchrone le tri de classification de la page de catégorie d'article d'arrière-plan

1) Vérifiez si jquery est introduit dans le modèle principal

2) Écrivez JS

$(function(){});

Écrivez le format de base de jquery

$(function(){
alert();
});

3) Utilisez JS pour envoyer de manière asynchrone

parce que je veux. Les événements sont envoyés lors de l'utilisation de ce formulaire de saisie,

<input type="text" onchange="onchangeOrder（）" value="{{$v->cate_order}}">  //加一个事件onchange，请求方法onchangeOrder方法

4) (2) est destiné aux tests,

function onangeOrder（）{
alert();
}

5) Suivant , une requête asynchrone est envoyée

function onchangeOrder（）{
$.post("",{});//第一个url,第二个参数，第三个是回调函数function（$data）{}回调函数里我们用$data接收
}

6) Allocation d'adresse

function onchangeOrder（）{
$.post("{{url('admin/cate/changeorder')}}",{},function($data){});
}

7) Allocation de route

Route::post('admin/changeorder','CategoryController@changeorder');

8) Créer un nouveau contrôleur CategoryController.php

public function changeorder(){
      echo 123;
   }

9) Passer la valeur du jeton en arrière-plan

function onchangeOrder（）{
$.post("{{url('admin/cate/changeorder')}}",{'_token':'{{csrf_token()}}'},function($data){});
}

10) Passer quelques paramètres supplémentaires. Le premier paramètre est le paramètre _token, et le deuxième paramètre est l'information sur le paramètre à modifier. Les trois paramètres indiquent dans quelle mesure modifier ces informations de classification

Quelle information modifier

<input type="text" onchange="onchangeOrder({{$v->cate_id}})" value="{{$v->cate_order}}">

Combien. pour changer ces informations de classification en

<input type="text" onchange="onchangeOrder(this,{{$v->cate_id}})" value="{{$v->cate_order}}"> //能找到当前输入的值到底多少

11) Les paramètres d'acceptation suivants, le premier est l'objet, le second est cate_id

function onchangeOrder(obj，cate_id){
$.post("{{url('home/cate/changeorder')}}",{'_token':'{{csrf_token()}}'},function($data){});
}

12) Lisez la valeur que nous saisissons actuellement via obj

Ensuite, nous définissons une variable, cate_order est égal à $() puis transmettez obj, puis ses .val()

function onchangeOrder(obj，cate_id){
var cate_order=$(obj).val();
$.post("{{url('home/cate/changeorder')}}",{'_token':'{{csrf_token()}}'},function($data){});
}

et cate_id sont ce que nous transmettons. Il n'est pas nécessaire de traiter les paramètres transmis

13) Voici quelques paramètres à traiter

function onchangeOrder(obj，cate_id){
var cate_order=$(obj).val();
$.post("{{url('home/cate/changeorder')}}",{'_token':'{{csrf_token()}}','cate_id':cate_id,'cate_order':cate_order},function($data){});
}

14) Comment l'accepter après l'avoir transmis au contrôleur

public function changeorder(){
//用input方法接受前台传过来的值
 $input= Input::all();
print_r( $input);
}

15) Ensuite, récupérez les données cate_id correspondantes de la base de données, modifiez la valeur du cate_order correspondant, puis suivez le nouveau Quand ces données

public function changeorder(){
//用input方法接受前台传过来的值
$input= Input::all();
    $cate=CategroyModel::find($input['cate_id']);
      //然后改变order参数
   $cate->cate_order=$input['cate_order'];
    //更新数据库
    $res = $cate->update();
}

16) est mis à jour, une invite est donnée à la réception. C'est à ce moment-là que nous transmettons un $data[] à la réception

public function changeorder(){
//用input方法接受前台传过来的值
$input= Input::all();
$cate=CategroyModel::find($input['cate_id']);
//然后改变order参数
$cate->cate_order=$input['cate_order'];
//执行更新操作
$res=$cate->update();
 if($res){
        $data=[
            'status'=> 0,
            'msg'=>'更新成功！',
        ];
    }else{
        $data=[
            'status'=> 1,
            'msg'=>'更新失败！',
        ];
    }
   return $data;   //别忘了返回值
}

17) Obtenez la valeur de la fonction de rappel

function onchangeOrder(obj,cate_id){
var cate_order=$(obj).val();
$.post(
"{{url('home/cate/changeorder')}}",
{'_token':'{{csrf_token()}}','cate_id':cate_id,'cate_order':cate_order},
function(data){
alert(data.msg);
}
);
}

Maintenant, tout est terminé, mais le La fenêtre pop-up est trop moche, la section suivante partagera avec vous les informations d'installation du pop-up.

Les étapes ci-dessus sont mes notes d'étude. J'ai noté les étapes ou les points clés à opérer. Si vous ne comprenez rien, vous pouvez laisser un message. Merci pour votre soutien. J'espère que cela pourra aider Xiaobai. Si vous souhaitez voir plus d'informations sur le projet de blog, suivez-moi et je continuerai à partager dans le prochain article.

Recommandations associées : "tutoriel laravel"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!