美文网首页
国家省市城市区域页面联动查询

国家省市城市区域页面联动查询

作者: 五岁小孩 | 来源:发表于2021-01-12 20:47 被阅读0次

国家/省市/城市/区域 页面联动查询

  • 1.国家/省市/城市/区域sql数据

    \笔记\go\国家省市城市区域  页面联动查询\sql

  • html

    <!-- 国家 -->
<div class="form-group">
     <label class="col-sm-2 control-label form-label" style="font-weight:normal;text-align: right;">国家</label>
       <div class="col-sm-10">
         <select class="form-control select2" id="CunId" required>
             <option value="">选择国家</option>
              {{range $.countryData }}
                <option value="{{.CunId}}" {{if eq .CunId $.model.CunId}}selected{{end}}>{{.CunNameZH}}</option>
               {{end}}
          </select>
    </div>
 </div>
 <!-- 省份 -->
<div class="form-group">
     <label class="col-sm-2 control-label form-label" style="font-weight:normal;text-align: right;">省份</label>
     <div class="col-sm-10">
         <select class="form-control select2" id="ProId" required>
              <option value="">选择省份</option>
         </select>
     </div>
</div>
 <!-- 城市 -->
<div class="form-group">
    <label class="col-sm-2 control-label form-label" style="font-weight:normal;text-align: right;">城市</label>
    <div class="col-sm-10">
         <select class="form-control select2" id="CitId" required>
              <option value="">选择城市</option>
          </select>
     </div>
</div>
               
 <!-- 城市 -->
<div class="form-group">
     <label class="col-sm-2 control-label form-label" style="font-weight:normal;text-align: right;">区县</label>
     <div class="col-sm-10">
         <select class="form-control select2" id="DisId" required>
            <option value="">选择区县</option>
         </select>
       </div>
</div>

  • js

    $(function(){

    $('#CunId').change(function(){
        // 清空省份选择列表
        $("#ProId>option").remove();
        $("#ProId").append("<option value=''>选择省份</option>");
        // 清空城市选择列表
        $("#CitId>option").remove();
        $("#CitId").append("<option value=''>选择城市</option>");

        if(isNotNull($('#CunId').val())){
            showProvinceSelectDom('','ProId','选择省份',$('#CunId').val(),'');
        }

    });

    $('#ProId').change(function(){
        $("#CitId>option").remove();
        $("#CitId").append("<option value=''>选择城市</option>");
        if(isNotNull($('#ProId').val())){
            showCitySelectDom('','CitId','选择城市',$('#CunId').val(),$('#ProId').val(),'');
        }
    });

    $('#CitId').change(function(){
        $("#DisId>option").remove();
        $("#DisId").append("<option value=''>选择区县</option>");
        if(isNotNull($('#CitId').val())){
            showDistrictSelectDom('','DisId','选择区县',$('#CunId').val(),$('#ProId').val(),$('#CitId').val());
        }
    });

});

  • js-plugins

    
/**
 * 显示国家列表
 * @param rootUrl web root url
 * @param domId   select元素ID
 * @param allTxt 全部option文字
 * @param country 查询条件，名称
 * @returns
 */
function showCountrySelectDom(rootUrl,domId,allTxt,country){
    var path = "/public/common/country";

    var data = {
        "CunName":country
    }

    $.ajax({
        type : 'POST',
        url : rootUrl + path,
        data : JSON.stringify(data),
        dataType : 'json',
        contentType:"application/json",
        async : false,
        success : function(result) {
            var total = result.total;
            if(total > 0){
                $("#"+domId+">option").remove();
                $("#"+domId).append("<option value=''>"+allTxt+"</option>");
                if(result.total>0){
                    $(result.rows).each(function(i,v){
                        $("#"+domId).append('<option value="'+v.CunId+'" text="'+v.CunNameZH+'">'+v.CunNameZH+'</option>');
                    });
                }
            }
        }
    });
}

/**
 * 显示省份列表
 * @param rootUrl web root url
 * @param domId   select元素ID
 * @param allTxt 全部option文字
 * @param countryId 国家Id
 * @param province 查询条件，名称
 * @returns
 */
function showProvinceSelectDom(rootUrl,domId,allTxt,countryId,province){
    var path = "/public/common/province";

    var data = {
        "CunId":parseInt(countryId),
        "ProName":province
    }

    $.ajax({
        type : 'POST',
        url : rootUrl + path,
        data : JSON.stringify(data),
        dataType : 'json',
        contentType:"application/json",
        async : false,
        success : function(result) {
            var total = result.total;
            if(total > 0){
                $("#"+domId+">option").remove();
                $("#"+domId).append("<option value=''>"+allTxt+"</option>");
                if(result.total>0){
                    $(result.rows).each(function(i,v){
                        $("#"+domId).append('<option value="'+v.ProId+'" text="'+v.ProNameZH+'">'+v.ProNameZH+'</option>');
                    });
                }
            }
        }
    });
}

/**
 * 显示城市列表
 * @param rootUrl web root url
 * @param domId   select元素ID
 * @param allTxt 全部option文字
 * @param countryId 国家Id
 * @param provinceId 省份Id
 * @param province 查询条件，名称
 * @returns
 */
function showCitySelectDom(rootUrl,domId,allTxt,countryId,provinceId,city){
    var path = "/public/common/city";

    var data = {
        "CunId": parseInt(countryId),
        "ProId":parseInt(provinceId),
        "CitName":city
    }

    $.ajax({
        type : 'POST',
        url : rootUrl + path,
        data : JSON.stringify(data),
        dataType : 'json',
        contentType:"application/json",
        async : false,
        success : function(result) {
            var total = result.total;
            if(total > 0){
                $("#"+domId+">option").remove();
                $("#"+domId).append("<option value=''>"+allTxt+"</option>");
                if(result.total>0){
                    $(result.rows).each(function(i,v){
                        $("#"+domId).append('<option value="'+v.CitId+'" text="'+v.CitNameZH+'">'+v.CitNameZH+'</option>');
                    });
                }
            }
        }
    });
}

/**
 * 显示地区列表
 * @param rootUrl web root url
 * @param domId   select元素ID
 * @param allTxt 全部option文字
 * @param countryId 国家Id
 * @param provinceId 省份Id
 * @param cityId 城市Id
 * @param province 查询条件，名称
 * @returns
 */
function showDistrictSelectDom(rootUrl,domId,allTxt,countryId,provinceId,cityId,district){
    var path = "/public/common/district";

    var data = {
        "CunId": parseInt(countryId),
        "ProId":parseInt(provinceId),
        "CitId":parseInt(cityId),
        "DisName":district
    }

    $.ajax({
        type : 'POST',
        url : rootUrl + path,
        data : JSON.stringify(data),
        dataType : 'json',
        contentType:"application/json",
        async : false,
        success : function(result) {
            var total = result.total;
            if(total > 0){
                $("#"+domId+">option").remove();
                $("#"+domId).append("<option value=''>"+allTxt+"</option>");
                if(result.total>0){
                    $(result.rows).each(function(i,v){
                        $("#"+domId).append('<option value="'+v.DisId+'" text="'+v.DisNameZH+'">'+v.DisNameZH+'</option>');
                    });
                }
            }
        }
    });
}

  • 接口

    router:

        //   --------  通用查询（国家/省份/城市/区县）  --------
  router.POST("/public/common/country", service.PubQueryCountry)
  router.POST("/public/common/province", service.PubQueryProvince)
  router.POST("/public/common/city", service.PubQueryCity)
  router.POST("/public/common/district", service.PubQueryDistrict)

    service:

    // 国家/省份/城市/区县查询
type ParamCouProCitDis struct {
  CunId   int    `json:"CunId"`
  CunName string `json:"CunName"`

  ProId   int    `json:"ProId"`
  ProName string `json:"ProName"`

  CitId   int    `json:"CitId"`
  CitName string `json:"CitName"`

  DisId   int    `json:"DisId"`
  DisName string `json:"DisName"`
}

// 查询国家列表
func PubQueryCountry(c *gin.Context) {
  var modelParamThis ParamCouProCitDis
  var err error

  bodyBytes, _ := ioutil.ReadAll(c.Request.Body)
  //fmt.Println(string(bodyBytes))

  err = json.Unmarshal(bodyBytes, &modelParamThis)

  if err != nil {
      c.JSON(http.StatusOK, gin.H{
          "success": false,
          "message": "请求参数错误",
      })
  } else {
      // add your business code here

      // 条件
      queryStr := "1 = ?"
      queryVal := []interface{}{1}

      // 查询条件拼装

      // 名称
      if !common.IsEmpty(modelParamThis.CunName) {
          queryStr += " AND CunNameZH LIKE ?"
          queryVal = append(queryVal, "%"+modelParamThis.CunName+"%")
      }

      queryModel := &model.SysCountry{}
      queryArray := &[]model.SysCountry{}
      // 排序
      sortArray := []string{"CunNameZH asc"}
      queryDb := dao.QueryArrays(queryModel.TableName(), queryArray, sortArray, queryStr, &queryVal, nil)

      if queryDb.Error == nil {
          c.JSON(http.StatusOK, gin.H{
              "success": true,
              "rows":    queryArray,
              "total":   queryDb.RowsAffected,
              "message": "success",
          })
      } else {
          c.JSON(http.StatusOK, gin.H{
              "success": false,
              "rows":    queryArray,
              "total":   queryDb.RowsAffected,
              "message": queryDb.Error.Error(),
          })
      }

  }
}

// 查询省份列表
func PubQueryProvince(c *gin.Context) {
  var modelParamThis ParamCouProCitDis
  var err error

  bodyBytes, _ := ioutil.ReadAll(c.Request.Body)
  //fmt.Println(string(bodyBytes))

  err = json.Unmarshal(bodyBytes, &modelParamThis)

  if err != nil {
      c.JSON(http.StatusOK, gin.H{
          "success": false,
          "message": "请求参数错误",
      })
  } else {
      // add your business code here

      // 条件
      queryStr := "1 = ?"
      queryVal := []interface{}{1}

      // 查询条件拼装

      // CunId
      if modelParamThis.CunId > 0 {
          queryStr += " AND CunId = ?"
          queryVal = append(queryVal, modelParamThis.CunId)
      }

      // 名称
      if !common.IsEmpty(modelParamThis.ProName) {
          queryStr += " AND ProNameZH LIKE ?"
          queryVal = append(queryVal, "%"+modelParamThis.ProName+"%")
      }

      queryModel := &model.SysProvince{}
      queryArray := &[]model.SysProvince{}
      // 排序
      sortArray := []string{"ProNameZH asc"}
      queryDb := dao.QueryArrays(queryModel.TableName(), queryArray, sortArray, queryStr, &queryVal, nil)

      if queryDb.Error == nil {
          c.JSON(http.StatusOK, gin.H{
              "success": true,
              "rows":    queryArray,
              "total":   queryDb.RowsAffected,
              "message": "success",
          })
      } else {
          c.JSON(http.StatusOK, gin.H{
              "success": false,
              "rows":    queryArray,
              "total":   queryDb.RowsAffected,
              "message": queryDb.Error.Error(),
          })
      }

  }
}

// 查询城市列表
func PubQueryCity(c *gin.Context) {
  var modelParamThis ParamCouProCitDis
  var err error

  bodyBytes, _ := ioutil.ReadAll(c.Request.Body)
  //fmt.Println(string(bodyBytes))

  err = json.Unmarshal(bodyBytes, &modelParamThis)

  if err != nil {
      c.JSON(http.StatusOK, gin.H{
          "success": false,
          "message": "请求参数错误",
      })
  } else {
      // add your business code here

      // 条件
      queryStr := "1 = ?"
      queryVal := []interface{}{1}

      // 查询条件拼装

      // CunId
      if modelParamThis.CunId > 0 {
          queryStr += " AND CunId = ?"
          queryVal = append(queryVal, modelParamThis.CunId)
      }

      // ProId
      if modelParamThis.ProId > 0 {
          queryStr += " AND ProId = ?"
          queryVal = append(queryVal, modelParamThis.ProId)
      }

      // 名称
      if !common.IsEmpty(modelParamThis.CitName) {
          queryStr += " AND CitNameZH LIKE ?"
          queryVal = append(queryVal, "%"+modelParamThis.CitName+"%")
      }

      queryModel := &model.SysCity{}
      queryArray := &[]model.SysCity{}
      // 排序
      sortArray := []string{"CitNameZH asc"}
      queryDb := dao.QueryArrays(queryModel.TableName(), queryArray, sortArray, queryStr, &queryVal, nil)

      if queryDb.Error == nil {
          c.JSON(http.StatusOK, gin.H{
              "success": true,
              "rows":    queryArray,
              "total":   queryDb.RowsAffected,
              "message": "success",
          })
      } else {
          c.JSON(http.StatusOK, gin.H{
              "success": false,
              "rows":    queryArray,
              "total":   queryDb.RowsAffected,
              "message": queryDb.Error.Error(),
          })
      }
  }
}

// 查询区县列表
func PubQueryDistrict(c *gin.Context) {
  var modelParamThis ParamCouProCitDis
  var err error

  bodyBytes, _ := ioutil.ReadAll(c.Request.Body)
  //fmt.Println(string(bodyBytes))

  err = json.Unmarshal(bodyBytes, &modelParamThis)

  if err != nil {
      c.JSON(http.StatusOK, gin.H{
          "success": false,
          "message": "请求参数错误",
      })
  } else {
      // add your business code here

      // 条件
      queryStr := "1 = ?"
      queryVal := []interface{}{1}

      // 查询条件拼装

      // CunId
      if modelParamThis.CunId > 0 {
          queryStr += " AND CunId = ?"
          queryVal = append(queryVal, modelParamThis.CunId)
      }

      // ProId
      if modelParamThis.ProId > 0 {
          queryStr += " AND ProId = ?"
          queryVal = append(queryVal, modelParamThis.ProId)
      }

      // CitId
      if modelParamThis.ProId > 0 {
          queryStr += " AND CitId = ?"
          queryVal = append(queryVal, modelParamThis.CitId)
      }

      // 名称
      if !common.IsEmpty(modelParamThis.DisName) {
          queryStr += " AND DisNameZH LIKE ?"
          queryVal = append(queryVal, "%"+modelParamThis.DisName+"%")
      }

      queryModel := &model.SysDistrict{}
      queryArray := &[]model.SysDistrict{}
      // 排序
      sortArray := []string{"DisNameZH asc"}
      queryDb := dao.QueryArrays(queryModel.TableName(), queryArray, sortArray, queryStr, &queryVal, nil)

      if queryDb.Error == nil {
          c.JSON(http.StatusOK, gin.H{
              "success": true,
              "rows":    queryArray,
              "total":   queryDb.RowsAffected,
              "message": "success",
          })
      } else {
          c.JSON(http.StatusOK, gin.H{
              "success": false,
              "rows":    queryArray,
              "total":   queryDb.RowsAffected,
              "message": queryDb.Error.Error(),
          })
      }
  }
}

相关文章

网友评论

      本文标题：国家省市城市区域页面联动查询

      本文链接：https://www.haomeiwen.com/subject/pdvonktx.html

      延伸阅读

      深度阅读

      • 您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！

      栏目导航

      热点阅读

      关于我们|服务条款|联系我们|国家省市城市区域页面联动查询|投稿指南|网站地图|RSS订阅|排版工具|手机版

      提供经典美文摘抄,优美散文欣赏,现代诗歌精选,短篇小说,心情随笔,表白情书范文,故事会在线阅读欣赏

      Copyright © 2014-2023 Haomeiwen.com All Rights Reserved. 好美文阅读网 版权所有

      备案信息：桂公网安备 45052102000051号 · 桂ICP备13007215号-3

      本站所收录作品、热点评论等信息部分来源互联网，目的只是为了系统归纳学习和传递资讯

      所有作品版权归原创作者所有，与本站立场无关，如不慎侵犯了你的权益，请联系我们告知，我们将做删除处理！