tp5+五级联动+ui框架

最新推荐文章于 2021-11-15 15:04:07 发布

咯咯咯咯咯咯咯咯咯咯

最新推荐文章于 2021-11-15 15:04:07 发布

阅读量172

点赞数 3

文章标签： php mysql sql js 数据库

本文链接：https://blog.csdn.net/qq_51504905/article/details/115908851

版权

<!DOCTYPE html>
<html>
    <head>
        <style>
        </style>
        <meta charset="UTF-8">
        <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
		<link rel="stylesheet" href="//unpkg.com/layui@2.6.4/dist/css/layui.css">
		<script src="static/js/layui.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>	
    		<form class='layui-form'>
			省：<select name="province" id="province" class="province" lay-verify="" lay-search lay-filter="brickType">
                <option id='op'></option>
                {foreach $a as $vo}
                    <option value="{$vo.provice_id}">{$vo.provice_name}</option>
                {/foreach}
            	</select>
            </form>
            <form class='layui-form'>
            市：<select name="city" id="city" class="city" lay-verify="" lay-search lay-filter="brickType1">
                    <option>请选择市</option> 
                </select>
            </form>
            <form class='layui-form'>
            区：<select name="county" id="county" class="county" lay-verify="" lay-search lay-filter="brickType2">
		            <option>请选择区</option>
                </select>
            </form>
            <form class='layui-form'>
	        镇：<select name="town" id="town" class="town" lay-verify="" lay-search lay-filter="brickType3">
	                <option value="">请选择县</option>
	            </select>
	       </form>
	       <form class='layui-form'>
	        乡：<select name="village" id="village" class="village" >
	                <option value="">请选择村</option>
	            </select>
	       </form>
<script>

    layui.use('form', function() {
		var form = layui.form;
		form.on('select(brickType)', function(data) {
			var val = data.value;
			console.log(val);
			$.ajax({
            url:'index/five/province',
            data:{
                'key':val,
            },
            type:'POST',
            success:function(res){
                console.log(res);
                var html='<option>请选择市</option>';
                for(var i=0;i<res.length;i++){
                    html+='<option value='+res[i].city_id+'>'+res[i].city_name+'</option>';
                }
                $('#city').html(html) ;
                form.render('select')
            }
        })
		
		});
	});
layui.use('form', function() {
		var form = layui.form;
		form.on('select(brickType1)', function(data) {
			var val = data.value;
			console.log(val);
			$.ajax({
            url:'index/five/city',
            data:{
                'key':val,
            },
            type:'POST',
            success:function(res){
                console.log(res);
                var html='<option>请选择区</option>';
                for(var i=0;i<res.length;i++){
                    html+='<option value='+res[i].county_id+'>'+res[i].county_name+'</option>';
                }
                $('#county').html(html) ;
                form.render('select');
            }
        })
		});
	});
  layui.use('form', function() {
		var form = layui.form;
		form.on('select(brickType2)', function(data) {
			var val = data.value;
			console.log(val);
			$.ajax({
            url:'index/five/county',
            data:{
                'key':val,
            },
            type:'POST',
            success:function(res){
                console.log(res);
                var html='<option>请选择县</option>';
                for(var i=0;i<res.length;i++){
                    html+='<option value='+res[i].town_id+'>'+res[i].town_name+'</option>';
                }
                $('#town').html(html) ;
                form.render('select');
            }
        })
		
		});
	});
  
  
  
  layui.use('form', function() {
		var form = layui.form;
		form.on('select(brickType3)', function(data) {
			var val = data.value;
			console.log(val);
			$.ajax({
            url:'index/five/town',
            data:{
                'key':val,
            },
            type:'POST',
            success:function(res){
                console.log(res);
                var html='<option>请选择村</option>';
                for(var i=0;i<res.length;i++){
                    html+='<option value='+res[i].village_id+'>'+res[i].village_name+'</option>';
                }
                $('#village').html(html) ;
                form.render('select');
            }
        })
		
		});
	});
</script>


    </body>
</html>

<?php
namespace app\index\controller;
use think\Db;
use think\Controller;

class Five extends \think\Controller
{
    public function five()
    {
      $priv=Db::table('ssyc_position_provice')->select();
      $this->assign('a',$priv);
      return $this->fetch('index');
    }
   
	public function province(){
	    //通过省的id查找到市里有省的id
	    $key_id=input('key');
	    //echo $pro_id; 
	    $city=Db::table('ssyc_position_city')->where('province_id',$key_id)->select();
	    //var_dump($city); 
	    return $city;
	}
	
	public function city(){
	    $city=input('key');
	    //var_dump($city);
	    $county=Db::table('ssyc_position_county')->where('city_id',$city)->select();
	    return $county;
	}
  public function county(){
	    $county=input('key');
	    //var_dump($county);
	    $town=Db::table('ssyc_position_town')->where('county_id',$county)->select();
	    return $town;
	}
	 public function town(){
	    $town=input('key');
	    $village=Db::table('ssyc_position_village')->where('town_id',$town)->select();
	    //var_dump($village);
	    return $village;
	}
}
?>

祝各位读者老爷不脱发，快脱单，逻辑灵感迸发，hold不住的那种。
happy everyday！！！！！！！！！！！！！！！咳记得一键三连！

咯咯咯咯咯咯咯咯咯咯

关注

3
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
tp5+五级联动+ui框架

<!DOCTYPE html><html> <head> <style> </style> <meta charset="UTF-8"> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <link rel="stylesheet" href=
复制链接

扫一扫