宿迁腾云网络网站建设公司

腾云网络 八年经验专注网站建设
  • 首页
  • 服务项目
    • 网站建设
    • 微信小程序
    • APP开发
    • SEO优化
  • 建站费用
  • 成功案例
    • 网站建设案例
    • 小程序案例
    • APP开发案例
    • SEO优化案例
  • 行业动态
    • 网站建设
    • SEO优化
    • 技术日志
  • 联系我们
    • 关于我们
首页 > 行业动态 > 技术日志 > PHP thinkphp5 + layui 实现四级联动

PHP thinkphp5 + layui 实现四级联动

2020-05-18

  <div class="layui-form-item layui-form-pane">
        <label class="layui-form-label">城市联动</label>
        <div class="layui-input-inline" >
            <select name="province" lay-verify="required" lay-search="" lay-skin="select" lay-filter="province" >
                <option value="">请选择省</option>
               <foreach name="arealist" item="v">
                   <option value="{$v.id}">{$v.area_name}</option>
               </foreach>
            </select>
        </div>
        <div class="layui-input-inline" >
            <select name="city" lay-verify="required" lay-search="" lay-skin="select" lay-filter="city" id="city">
                <option value="">请选择市/县</option>
            </select>
        </div>
        <div class="layui-input-inline" >
            <select name="area" lay-verify="required" lay-search=""lay-skin="select" lay-filter="area" id="area">
                <option value="">请选择镇区</option>
            </select>
        </div>
            <div class="layui-input-inline" >
            <select name="area" lay-verify="required" lay-search=""lay-skin="select" lay-filter="street" id="street">
                <option value="">请选择街道</option>
            </select>
        </div>
    </div>

html 部分

<script>
    layui.use(['form', 'layedit', 'laydate'],
    function() {
        var $ = layui.jquery,
        form = layui.form,
        layer = layui.layer,
        layedit = layui.layedit,
        laydate = layui.laydate;
 
        //监听省份选择
        form.on('select(province)',
        function(data) {
            $('#city').html('<option value="">请选择市/县</option>');
            $('#area').html('<option value="">请选择镇区</option>');
            $('#street').html('<option value="">请选择街道</option>');
            $.ajax({
                url: "{:U('Admin/getchildarea')}",
                data: {
                    parent_id: data.value
                },
                type: 'POST',
                dataType: 'json',
                success: function(data1) {
                    if (data1.error == 0) {
                        $("#city").append(data1.option);
                        form.render('select'); //刷新select选择框渲染
                    }
                }
            });
        });
        form.on('select(city)',
        function(data) {
            $('#area').html('<option value="">请选择镇区</option>');
            $('#street').html('<option value="">请选择街道</option>');
            $.ajax({
                url: "{:U('Admin/getchildarea')}",
                data: {
                    parent_id: data.value
                },
                type: 'POST',
                dataType: 'json',
                success: function(data1) {
                    if (data1.error == 0) {
                        $("#area").append(data1.option);
                        form.render('select'); //刷新select选择框渲染
                    }
                }
            });
        });
        //监听省份选择
        form.on('select(area)',
        function(data) {
            $('#street').html('<option value="">请选择街道</option>');
            $.ajax({
                url: "{:U('Admin/getchildarea')}",
                data: {
                    parent_id: data.value
                },
                type: 'POST',
                dataType: 'json',
                success: function(data1) {
                    if (data1.error == 0) {
                        $("#street").append(data1.option);
                        form.render('select'); //刷新select选择框渲染
                    }
                }
            });
        });
 
        //监听提交
        form.on('submit(demo1)',
        function(data) {
            layer.alert(JSON.stringify(data.field), {
                title: '最终的提交信息'
            }) return false;
        });
 
    });
</script>

js部分

     public function loudong() {
        $ld_id= input('post.parent_id');
        $where['district_id'] = $ld_id;
        $area = db('表名')->field('id, name')->where($where)->select();
        if ($area) {
            $option = '<option value=""></option>';
            foreach ($area as $key => $value) {
                $option .= '<option   value="'.$value['id'].'">'.$value['name'].'</option>';
 
            }
            echo json_encode(array('error' => 0, 'option' => $option));
        } else {
            echo json_encode(array('error' => 1));
        }
 
    }

PHP部分

可以实现无限级分类~

Tag:
网站制作公众号

宿迁腾云网络网站建设公司 | 网站开发 | 网站制作 | 网站优化

咨询电话:13160355545

上一篇

返回栏目

下一篇

免责声明:本站所有文章和图片均来自用户分享和网络收集,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系网站客服处理。

热推

  • .12编程语言具有某些功能..7.20
  • PHP开源软件开发人员编写单元测试时的常犯错误
  • 网站后台管理系统php基于PHP+的新闻管理系统开发的可行性分析与意义php 网站后台管理系统
  • php开源企业网站系统本周推出企业级别的应用程序是正在变得更加商用化的象征php开源企业
  • php源码加密工具 开源PHP语言的八大优势,你知道几个?(上)cms php开源源码
  • php绑定域名授权代码一下如何做一些修改让多个域名可以绑定到同一个空间上php域名授权
  • php编程培训班跟随兄弟连一起看看!1.PHP编程语言有着长远的市场需求达内培训 京php班
  • php网站管理系统模板源代码开放的建站系统安全吗?开源建站系统发布+不断升级php中网站不同模板后台逻辑代码怎么管理
  • 微软70的漏洞仍然是内存安全问题的例子?|译文
  • 面向对象编程的常用方法广告上线泡点直升100级,免费领取召唤术

相关

标签

seo(1192) 市场营销(661) 网站制作(574) 网站建设(568) 搜索引擎(553) 网站(482) PHP(363) 编程语言(346) 建站(294) 关键词排名优化(267) 网站建设公司(245) 优化(216) seo排名(207) 域名(190) 软件(171) 网站优化(150) 搜索引擎优化(150) 外链(141) 科技(136) 网站关键词(124) 网站排名优化(123) 域名服务器(120) 网站排名(111) 时政(103) 排名优化(95) 搜索引擎收录(93) 网站设计(93) 电子商务(88) 引擎(86) 移动互联网(85) 开发框架(79) 开发(75) 网站服务器(74) 框架(68) 前端开发(68) 网站建设方案(66) 网站分析(66) 关键(64) 流量(63) 源码(62) 百度优化(62) 网站权重(61) 开放源代码(59) seo培训(53) php框架(51) 网页设计(51) 百度(51) 网站建设知识(50) 谷歌(50) 网站结构(50)
宿迁腾云网络网站建设公司
网站建设
  • 私人定制
  • 标准模板建站
  • 经济模板建站
精品模板

宿迁腾云网络网站建设公司

联系电话:13160355545

公司地址:江苏省宿迁市丽景湾华庭北门都市花园公寓9楼907

联系邮箱:admin@tyweb.net

全国分站
  • 北京
  • 广东
  • 东莞 广州 中山 深圳 惠州 江门 珠海 汕头 佛山 湛江 河源 肇庆 潮州 清远 韶关 揭阳 阳江 云浮 茂名 梅州 汕尾
  • 山东
  • 济南 青岛 临沂 济宁 菏泽 烟台 泰安 淄博 潍坊 日照 威海 滨州 东营 聊城 德州 莱芜 枣庄
  • 江苏
  • 苏州 徐州 盐城 无锡 南京 南通 连云港 常州 扬州 镇江 淮安 泰州 宿迁
  • 河南
  • 郑州 南阳 新乡 安阳 洛阳 信阳 平顶山 周口 商丘 开封 焦作 驻马店 濮阳 三门峡 漯河 许昌 鹤壁 济源
  • 上海
  • 河北
  • 石家庄 唐山 保定 邯郸 邢台 沧州 秦皇岛 张家口 衡水 廊坊 承德
  • 浙江
  • 温州 宁波 杭州 台州 嘉兴 金华 湖州 绍兴 舟山 丽水 衢州
  • 陕西
  • 西安 咸阳 宝鸡 汉中 渭南 安康 榆林 商洛 延安 铜川
  • 湖南
  • 长沙 邵阳 常德 衡阳 株洲 湘潭 永州 岳阳 怀化 郴州 娄底 益阳 张家界 湘西
  • 重庆
  • 福建
  • 漳州 泉州 厦门 福州 莆田 宁德 三明 南平 龙岩
  • 天津
  • 云南
  • 昆明 红河 大理 文山 德宏 曲靖 昭通 楚雄 保山 玉溪 丽江 临沧 思茅 西双版纳 怒江 迪庆
  • 四川
  • 成都 绵阳 广元 达州 南充 德阳 广安 阿坝 巴中 遂宁 内江 凉山 攀枝花 乐山 自贡 泸州 雅安 宜宾 资阳 眉山 甘孜
  • 广西
  • 贵港 玉林 北海 南宁 柳州 桂林 梧州 钦州 来宾 河池 百色 贺州 崇左 防城港
  • 安徽
  • 芜湖 合肥 六安 宿州 阜阳 安庆 马鞍山 蚌埠 淮北 淮南 宣城 黄山 铜陵 亳州 池州 巢湖 滁州
  • 海南
  • 三亚 海口 琼海 文昌 东方
  • 江西
  • 南昌 赣州 上饶 吉安 九江 新余 抚州 宜春 景德镇 萍乡 鹰潭
  • 湖北
  • 武汉 宜昌 襄樊 荆州 恩施 孝感 黄冈 十堰 咸宁 黄石 仙桃 随州 天门 荆门 潜江 鄂州 神农架
  • 山西
  • 太原 大同 运城 长治 晋城 忻州 临汾 吕梁 晋中 阳泉 朔州
  • 辽宁
  • 大连 沈阳 丹东 辽阳 葫芦岛 锦州 朝阳 营口 鞍山 抚顺 阜新 本溪 盘锦 铁岭
  • 黑龙江
  • 齐齐哈尔 哈尔滨 大庆 佳木斯 双鸭山 牡丹江 鸡西 黑河 绥化 鹤岗 伊春 大兴安岭 七台河
  • 内蒙古
  • 赤峰 包头 通辽 呼和浩特 乌海 鄂尔多斯 呼伦贝尔
  • 贵州
  • 贵阳 黔东 黔南 遵义 黔西 毕节 铜仁 安顺 六盘水
  • 甘肃
  • 兰州 天水 庆阳 武威 酒泉 张掖 陇南 白银 定西 平凉 嘉峪关 临夏 金昌 甘南
  • 青海
  • 西宁 海西 海东 海北 果洛 玉树 黄南
  • 新疆
  • 乌鲁木齐 伊犁 昌吉 石河子 哈密
  • 西藏
  • 拉萨 山南 林芝 日喀则
  • 吉林
  • 长春 白山 白城 延边 松原 辽源 通化 四平
  • 宁夏
  • 银川 吴忠 中卫 石嘴山 固原
SiteMap
网站地图
TAG标签
Copyright © 2017-2025 TYWEB.NET 宿迁腾云网络科技有限公司 ALL RIGHTS RESERVED.   苏ICP备17033535号-1

热门搜索

网站建设 网站 公司 宿迁 模版 模板 源码 教育 学校 响应式 百度 营销型 seo 网站架构 交通设备制作 教育类网站 项王故里网站建设案例 中文编程 优化 管理
  • 客服

    在线客服

  • 电话

    13160355545

  • 微信

精品模板
建站费用
成功案例
联系我们