做网站找实速,专业网站制作设计平台
首页 > 课堂 > 网站技术 > 详情
网站标签 / Tags

帝国CMS7.2实现地区三级联动并且前台可地区筛选的插件教程

2020-02-16 16:48:50   来源:实速网络|网站建设|网站设计|网站优化|网站仿制|网站SEO|网站推广|空间域名|主机VPS|服务器|网站源码|网站模版   浏览: 次
帝国CMS7.2实现地区三级联动并且前台可地区筛选的插件教程 发布时间:2018-11-16 来源:互联网 浏览: 关键词:帝国CMS 三级联动

帝国CMS7.2实现地区三级联动并且前台可地区筛选的插件教程

发布时间:2018-11-16 来源:互联网 浏览: 关键词:帝国CMS 三级联动 

今天魔酷阁给大家分享一款帝国cms的三级联动插件,优势是可以自己设定区域,修改相关地区数据,接下来我们看一下使用步骤。

第一步:后台添加三个数据表字段

字段名:pro   字段标识:省    输入表单替换html代码为如下代码:  

<select name="pro"></select>

字段名:city  字段标识:市    输入表单替换html代码:

<select name="area"></select>

字段名:area  字段标识:县    输入表单替换html代码:

 

第二步:建立完毕后,在到 管理系统模型  设置上边添加的三个字段设为 提交项,可添加、修改、列表显示、内容页显示、结合项,并生成相应的表单!

 

第三步:打开e/admin/AddNews.php   把以下代码粘贴到  结尾的随便位置即可

 

<script type="text/javascript" src="selects.js"></script>  <script type="text/javascript" src="data_china.js"></script>  <script type="text/javascript">  var s = selects;  //获取对象  var p = document.getElementsByName('pro')[0];//省  var c = document.getElementsByName('city')[0];//市  var a = document.getElementsByName('area')[0];//区  //绑定数据  s.bind(p,province);  s.bind(c,city);  s.bind(a,area);  //确定从属关系  s.parent(p,c);  s.parent(c,a);  //设置默认值  s.selected(p,{value:'<?=$ecmsfirstpost==1?"":htmlspecialchars(stripSlashes($r[pro]))?>'});  s.selected(c,{value:'<?=$ecmsfirstpost==1?"":htmlspecialchars(stripSlashes($r[city]))?>'});  s.selected(a,{value:'<?=$ecmsfirstpost==1?"":htmlspecialchars(stripSlashes($r[area]))?>'});  </script>  

 另外,也可以把上述代码放到相应模型的输入表单里,比修改文件更方便一些。

第四步:下载附件两个JS文件上传到e/admin/文件夹,此处为UTF-8编码格式,如果需要gbk或其他编码请自己转码。

执行到这里,我们已经可以在后台添加信息时选择地区联动了。

但前台页面上还没有地区选择功能,我们可以在需要的页面添加如下代码,来实现地区的筛选,此处利用了帝国cms的结合项来进行筛选。

<script type="text/javascript" src="[!--news.url--]js/selects.js"></script>         <script type="text/javascript" src="[!--news.url--]js/data_china.js"></script>                             <form method="get" action="[!--news.url--]e/action/ListInfo.php">                 <input value="10" type="hidden" name="mid">                <input value="17" type="hidden" name="classid">                <input value="1" type="hidden" name="ph">                <input value="12" type="hidden" name="tempid">                                     <select name="pro"></select>                   <select name="city"></select>                   <select name="area"></select>                   <INPUT value="确定" type="submit" name="提交">                  </FORM>              <script type="text/javascript">  var s = selects;  //获取对象  var p = document.getElementsByName('pro')[0];//省  var c = document.getElementsByName('city')[0];//市  var a = document.getElementsByName('area')[0];//区  //绑定数据  s.bind(p,province);  s.bind(c,city);  s.bind(a,area);  //确定从属关系  s.parent(p,c);  s.parent(c,a);  //设置默认值  s.selected(p,{value:'<?=$ecmsfirstpost==1?"":htmlspecialchars(stripSlashes($r[pro]))?>'});  s.selected(c,{value:'<?=$ecmsfirstpost==1?"":htmlspecialchars(stripSlashes($r[city]))?>'});  s.selected(a,{value:'<?=$ecmsfirstpost==1?"":htmlspecialchars(stripSlashes($r[area]))?>'});  </script>  

至此我们的设置就完成了,这里尤其要注意的就是引入的js文件路径一定要正确,否则会造成功能无法使用哟!

在前台的筛选表单里边有几个参数,大家需要注意:四个默认字段中mid指的是模型ID,classid是栏目ID,tempid是筛选列表所使用的模板ID(列表页模板),ph是使用结合项,ph参数是必须等于1的,表示使用结合项,否则不能筛选

下面是使用筛选功能的页面示例,大家可以参考。

帝国CMS7.2实现地区三级联动并且前台可地区筛选的插件教程

责任编辑:MOKUGE
相关热词搜索: 上一篇:帝国cms报错connect.php(2439) : eval()'d code on line 1的解决办法 下一篇:帝国cms图片集将字段分割输出大图和小图(缩略图)教程