zoukankan      html  css  js  c++  java
  • 【ajax+php】动态展示4级单位(省、市、县、镇)

    1、本篇教程以ajax+php动态展示【省、市、县、镇】四级地区单位

    2、效果图:     

    3、不废话,贴代码!

    HTML:

              <div class="form-group">
                <label class="col-sm-3 control-label" for="onecity"> 
                    地区分类
                    <span class="text-danger">*</span>
                </label>
                <div class="col-sm-2">
                    <select class="form-control"  id="onecity" name="onecity" onchange="city()">
                        <option value="">请选择一级地区</option>
                        {loop $one $v}
                        <option value="{$v['id']}">{$v['name']}</option>
                        {/loop}
                    </select>
                </div>
                <!-- 二级城市 -->
                <div class="col-sm-2" id="ss">
                </div>
                <!-- 三级城市 -->
                <div class="col-sm-2" id="ss2">
                </div>
                <div class="col-sm-2" id="ss3">
                        </div>
                <script text="text/javascript">
                            function city(){
                                 var one=$("#onecity").val();
                                 $.ajax({
                                       type: "POST",
                                       url: "/index.php?do=pubh***_third&id=19&step=step1_third&fc=1&one="+one,
                                       success: function(msg){
                                           $("#ss").empty();
                                           $("#ss").append(msg);
                                       }
                                    });    
                            }
                        </script>
                        <script text="text/javascript">
                            function city2(){
                                 var two=$("#twocity").val();
                                 $.ajax({
                                       type: "POST",
                                       url: "/index.php?do=pubh***_third&id=19&step=step1_third&fc=2&two="+two,
                                       success: function(msg){
                                           $("#ss2").empty();
                                           $("#ss2").append(msg);
                                       }
                                    });    
                            }
                        </script>
                        <script text="text/javascript">
                    function city3(){
                         var three=$("#threecity").val();
                         $.ajax({
                               type: "POST",
                               dataType: 'json',
                               url: "/index.php?do=pubh***_third&id=19&step=step1_third&fc=3&three="+three,
                               success: function(res){
                                       $("#ss3").empty();
                                 if(res.data!='error'){
                                       $("#ss3").append(res.data);
                                 }
                               }
                            });    
                    }
                </script>
            </div>

    php:

            //1、首先将省级单位给输出到页面 -- 1225
            $one=db_factory::get_table_data("*",'w***_district','upid=0');
            
            //2、ajax动态判断传过来的pid(省),获取市级单位,并动态输出<select><option>数据html
            if($_R[fc]==1){
                if($_R['one']){
                    $msg=db_factory::get_table_data("*","w***_district","upid=".$_R['one']);
                }
                $dis='<select class="form-control" name="twocity"  id="twocity" onchange="city2();choose_village();"><option value="">请选择二级地区</option>';
                foreach($msg as $v){
                    $dis.='<option  value="'.$v[id].'">'.$v[name].'</option>';
                }
                $dis.='</select>';
                echo $dis;
                die;
            }
            if($_R[fc]==2){
                if($_R['two']){
                    $msg=db_factory::get_table_data("*","w***_district","upid=".$_R['two']);
                }
                $dis='<select class="form-control" name="threecity" id="threecity" onchange="city3();"><option value="">请选择三级地区</option>';
                foreach($msg as $v){
                    $dis.='<option value="'.$v[id].'">'.$v[name].'</option>';
                }
                $dis.='</select>';
                echo $dis;
                die;
            }
            if($_R[fc]==3){
                if($_R['three']){
                    $msg=db_factory::get_table_data("*","wi***_district","upid=".$_R['three']);
                }
                /* 四级单位有可能没有的,比如直辖市、自治州 */
                if($msg){
                    $dis='<select class="form-control" name="fourcity"  id="fourcity" ><option value="">请选择四级地区</option>';
                    foreach($msg as $v){
                        $dis.='<option value="'.$v[id].'">'.$v[name].'</option>';
                    }
                    $dis.='</select>';
                    kekezu::echojson("",1,$dis);
                    //echo $dis;
                    die;
                }
                else{
                    kekezu::echojson("",2,'error');//参数依次msg、status、data
                    die ();
                }
            }

    到这里就结束了,很简答的一个ajax应用。

  • 相关阅读:
    centos7下升级SSH
    docker: read tcp 192.168.7.235:36512->54.230.212.9:443: read: connection reset by peer.
    Rancher学习笔记----在UI界面添加主机页面无法正常显示
    Rancher3----安装部署rancher
    Rancher2-----了解什么是rancher以及简单部署
    unity坑-编译错误
    游戏UI系统设计
    使用采样器声明
    着色器数据类型和精度
    着色器编译目标等级
  • 原文地址:https://www.cnblogs.com/xuzhengzong/p/8116771.html
Copyright © 2011-2022 走看看