帝国cms结合项如何用？-建站教程-锦华智联科技

帝国CMS结合项（联动菜单）完全教程

什么是结合项？

结合项，通常被称为“联动菜单”，是帝国CMS一个非常实用的数据字段类型，它允许你创建一个多级联动的下拉菜单，选择上一级菜单后,下一级菜单会根据上一级的选项动态加载。

（图片来源网络，侵删）

典型应用场景：

地区选择：选择“省份”后，加载对应“城市”；选择“城市”后，加载对应“区/县”。
商品分类：选择“一级分类”（如“手机”），加载对应“二级分类”（如“华为”、“小米”）。
职位选择：选择“部门”（如“技术部”），加载对应“职位”（如“前端工程师”、“后端工程师”）。

使用结合项可以让数据录入更规范、更高效，也能为前台的数据筛选、展示提供便利。

如何创建结合项（后台设置）

创建结合项分为两步：创建数据表 和 在模型中添加字段。

步骤1：创建数据表

登录帝国CMS后台，点击顶部菜单的 系统 -> 数据表 -> 管理数据表。
在数据表管理页面，点击左上角的 增加数据表。
填写表单信息：
- 数据表名：给你的数据表起一个名字，建议使用英文，enewslinkage。
- ：填写一个易读的标题，地区联动表”。
- 字段前缀：可以留空，或者填写一个前缀，如 link_。
- 表类型：选择 “主表”。
- 程序ID：选择 “0” (通用)。
- 是否开启：勾选 “是”。
- 是否允许投稿：根据需要选择，一般选择“否”。
点击 “提交”，这样,一个空的数据表就创建好了。

步骤2：在模型中添加字段

回到后台首页，点击 -> 管理栏目。
选择你要添加联动菜单的栏目（新闻”栏目），点击 “管理字段”。
点击 “增加字段”,开始创建新字段。
填写字段信息：
- 字段名：起一个唯一的英文或数字名称，linkage_area。
- 字段标识：一个易于识别的名称，所在地区”。
- 字段类型：这是最关键的一步！ 选择 “结合项”。
- 数据表：从下拉列表中选择你刚刚创建的数据表，enewslinkage。
- 是否必填：根据需要选择。
- 前台提交替换：一般选择“HTML”。
- 其他选项：如提示文字、默认值等,可以按需设置。
点击 “提交”。

一个结合项字段就创建完成了,你需要向数据表中添加数据。

步骤3：向结合项数据表中添加数据

回到 系统 -> 数据表 -> 管理数据表。
找到你刚才创建的数据表（如 enewslinkage），点击 “管理数据”。
在数据管理页面，点击 “增加数据”。
录入数据结构：
- 联动菜单的数据有严格的层级关系,你需要手动录入。
- 第一级（如省份）：
  - link_pid (父ID): 填写 0,顶级菜单的父ID都是0。
  - link_name (名称): 填写省份名，如“北京市”。
- 第二级（如城市）：
  - link_pid (父ID): 填写其上一级（省份）的ID，如果你刚刚添加的“北京市”的ID是1，那么北京市下的“朝阳区”的 link_pid 就要填 1。
  - link_name (名称): 填写城市名，如“朝阳区”。
- 第三级（如区/县）：
  - link_pid (父ID): 填写其上一级（城市）的ID。
  - link_name (名称): 填写区/县名，如“望京街道”。

示例数据结构：

ID	link_pid	link_name
1	0	北京市
2	1	朝阳区
3	1	海淀区
4	0	上海市
5	4	浦东新区
6	4	黄浦区

注意： 每次添加完数据后，都要点击“提交”，录入数据可能比较繁琐,但这是实现联动功能的基础。

如何调用结合项（前台显示）

前台调用结合项数据，主要有两种方式：调用数据列表 和 调用字段值。

方法1：在列表模板中调用

列表页（如listinfo.php）显示每个条目的联动菜单值,直接使用字段名即可。

示例代码 (listinfo.php):

<?php
// ... 循环开始 ...
?>
<li>
    <a href="[!--titleurl--]">[!--title--]</a>
    <span>地区：[!--linkage_area--]</span> <!-- 直接调用字段名 -->
</li>
<?php
// ... 循环结束 ...
?>

帝国CMS会自动将 [!--linkage_area--] 替换为该条目在后台选择的对应 link_name 值（如“朝阳区”）。

方法2：在内容页模板中调用

详情页（如showinfo.php）调用,同样直接使用字段名。

示例代码 (showinfo.php):

<h1>[!--title--]</h1>
<p>发布时间：[!--newstime--]</p>
<p>所在地区：[!--linkage_area--]</p> <!-- 直接调用字段名 -->
<div>[!--smalltext--]</div>

方法3：获取完整的联动路径（如“北京市 > 朝阳区”）

你可能需要显示完整的层级路径，而不是最后一级的值，这需要用到一个函数 GetLinkagePath()。

函数语法： GetLinkagePath(数据表ID, 当前项的ID, 分隔符)

数据表ID：你可以在 系统 -> 数据表 -> 管理数据表 中找到你的数据表对应的ID。
当前项的ID页模板中，可以使用 $$linkage_area 来获取当前内容条目中该字段存储的ID。
分隔符：你希望用来连接各级名称的符号，如 >、等。

示例代码 (在内容页模板 showinfo.php 中):

<h1>[!--title--]</h1>
<p>发布时间：[!--newstime--]</p>
<!-- 假设你的联动数据表ID是5，字段名是linkage_area -->
<p>完整地区路径：<?=GetLinkagePath(5, $$linkage_area, ' > ')?></p>
<div>[!--smalltext--]</div>

输出结果： 完整地区路径：北京市 > 朝阳区

如何修改结合项的样式（JS/CSS）

默认情况下，结合项是标准的 <select> 下拉菜单，如果你想修改它的样式，或者使用更美观的UI组件（如jQuery Select2）,可以通过以下步骤实现：

定位模板文件：找到生成表单的模板文件，通常在 e/data/template/ 目录下，对应你模型的模板文件夹中，文件名为 info_add.php (添加页) 和 info_edit.php (修改页)。

定位生成代码：打开 info_add.php，找到结合项字段生成的代码,它看起来像这样：

<tr>
    <td height="25" bgcolor="#FFFFFF"><strong>所在地区：</strong></td>
    <td bgcolor="#FFFFFF">
        <select name="linkage_area" id="linkage_area">
            <option value="0">请选择...</option>
            <!-- 这里是JS动态生成的选项 -->
        </select>
        <select name="linkage_area_son" id="linkage_area_son">
            <option value="0">请选择...</option>
            <!-- 这里是JS动态生成的子选项 -->
        </select>
    </td>
</tr>

修改HTML结构：为了方便应用CSS或JS库，你可以给 select 添加 class 属性。

<tr>
    <td height="25" bgcolor="#FFFFFF"><strong>所在地区：</strong></td>
    <td bgcolor="#FFFFFF">
        <select name="linkage_area" id="linkage_area" class="form-control linkage-select">
            <option value="0">请选择省份</option>
        </select>
        <select name="linkage_area_son" id="linkage_area_son" class="form-control linkage-select">
            <option value="0">请选择城市</option>
        </select>
    </td>
</tr>

引入CSS/JS：在你的模板头部 (head 标签内) 引入你需要的CSS和JS文件,例如jQuery和Select2。

<!-- 在模板的head部分 -->
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>

初始化JS：在模板底部 (</body> 标签前) 编写JS代码来初始化你的UI组件。

<!-- 在模板的body底部 -->
<script>
$(document).ready(function() {
    // 初始化第一个下拉菜单
    $('#linkage_area').select2();
    // 初始化第二个下拉菜单
    $('#linkage_area_son').select2();
    // 如果你需要联动逻辑，可以结合帝国CMS自带的JS
    // 以下是帝国CMS联动菜单的默认JS调用方式，你需要把它和你的新UI整合起来
    // document.getElementById('linkage_area').onchange = new Function("ShowLinkage('linkage_area_son',this.value,'5','0','');");
    // 整合示例（以Select2为例）：
    $('#linkage_area').on('change', function() {
        var parentId = $(this).val();
        var childSelect = $('#linkage_area_son');
        // 清空子级选项，并添加一个“加载中”的选项
        childSelect.empty().append('<option value="0" disabled="disabled">加载中...</option>').trigger('change');
        // 调用帝国CMS的AJAX接口来加载子级数据
        $.get('/e/public/Linkage/?enews=Linkage&tbname=你的数据表名&yid=' + parentId, function(data){
            childSelect.empty().append('<option value="0">请选择城市</option>');
            // 解析返回的数据并添加到子级select中
            // 注意：这里需要根据帝国CMS返回的实际数据结构进行解析
            // 返回的数据通常是JSON格式，如 [{"id":2,"name":"朝阳区"}, ...]
            if(data.data){
                $.each(data.data, function(i, item) {
                    childSelect.append(new Option(item.name, item.id));
                });
            }
            childSelect.trigger('change'); // 重新渲染Select2
        });
    });
});
</script>

注意：上面的JS整合是一个示例，你需要根据帝国CMS实际返回的AJAX数据格式来调整，帝国CMS的AJAX接口会返回JSON格式的数据，包含 id 和 name 字段。

常见问题与解决方法

Q1: 为什么我的联动菜单在后台添加内容时没有选项，或者显示“请选择...”？ A: 这通常是因为你的数据表中没有数据，或者数据层级关系（link_pid）设置错误，请检查你的数据表，确保顶级菜单的 link_pid 为0，子级菜单的 link_pid 指向其父级的ID。

Q2: 为什么前台调用 [!--字段名--] 显示不出来？ A:

确认你在后台发布内容时,已经为该字段选择了值。
确认你的模板文件路径和字段名是否正确。
检查模型字段是否设置正确,并且与数据表关联。

Q3: 我想在搜索表单中使用联动菜单，怎么实现？ A: 这需要一些二次开发，你可以在搜索模板中手动构建两个 <select> 菜单，并让它们的 name 属性分别为 linkage_area 和 linkage_area_son，然后在搜索处理程序中，获取这两个值，并用SQL的 LIKE 或语句去查询数据表的 link_name 字段，这比较复杂，通常需要修改 /e/search/index.php 文件。

Q4: 结合项的选项可以无限级吗？ A: 理论上可以，但受限于数据库结构和页面性能，帝国CMS的结合项本身支持多级，但级数太多（如超过4-5级）会导致数据录入困难和用户体验下降，对于复杂的分类,建议不超过3级。