Home > Backend Development > PHP Tutorial > ThinkPHP usage experience sharing-ThinkPHP + Ajax to implement 2-level linkage drop-down menu_PHP tutorial

ThinkPHP usage experience sharing-ThinkPHP + Ajax to implement 2-level linkage drop-down menu_PHP tutorial

WBOY
Release: 2016-07-13 10:29:41
Original
1274 people have browsed it

The first is the design of the database. The classification table is called cate.

What I am doing is secondary linkage of classified data. The fields required for the data are: id, name (Chinese name), pid (parent id).

Setting of parent id: If the data does not have an upper level, the parent id is 0. If there is an upper level, the parent id is the id of the upper level.

After the database has content, you can start writing code to implement secondary linkage.

First obtain all the data with pid 0 in the background php, save it to $cate, and then use a foreach loop to output it in the first layer's
']}">{$v.ca_name}


Tag:



Ajax code:

Copy code The code is as follows:

  $('#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                               b+="";
                           }
                        $("#lables").append(b);
                    }
                });
               });
        }
    );

Ajax代码在第一层类型改变后触发,ajax方法的主要参数有

      1.url:后台接收ajax的地址;

      2.data:传到后台的数据,一般用json传递;这里传递的是选中类的id值。

      3.type:传递方法,有get和post方法,我一般用post,可以传输的数据比get多,安全性也高些;

      4.error:ajax执行失败的方法;

      5.success:ajax执行成功的方法,也就是回调函数。这里在执行success时,我先用empty()清空了第二个下拉菜单的内容,然后再输出从后台获取的数据。

下面是Thinkphp接收ajax数据并处理的页面

复制代码 代码如下:

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

Thinkphp's I() method can actually be regarded as $_POST[], so as to obtain the ID of the first-level selected content passed by ajax, then obtain its subclass, and then use ajaxReturn() to return it to ajax, here The return data is set to be in json form, so ajax will receive the data in json form

Native PHP return data method:

Copy code The code is as follows:

//The search result is $result
.....
echo json_encode($result);

This completes the implementation of the two-level linkage drop-down menu. It should be noted that the URL must be correct, and there must be a return value when received in the background, otherwise ajax will not execute the success method.

www.bkjia.comtruehttp: //www.bkjia.com/PHPjc/770583.htmlTechArticleThe first is the design of the database. The classification table is called cate. What I am doing is the second-level linkage of classified data. The fields required for the data are: id, name (Chinese name), pid (parent id). Setting of the parent id: If the data is not uploaded...
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template