技术问询：能否在OctoberCMS后端将表单与列表置于同一页面？

当然可以解决这个问题！当你的表单字段过少导致页面空白过多时，把列表和表单整合到同一页面是个非常实用的方案，下面给你两种靠谱的实现方式：

方法一：自定义控制器视图，直接混排列表与表单 #

这是最直接的方式，让列表和表单在同一页面内展示，你可以自由控制它们的布局：

1. 确保控制器具备双功能
   打开对应模型的控制器文件（比如plugins/yourvendor/yourplugin/controllers/YourModel.php），让它同时继承ListController和FormController，这样控制器就能同时处理列表和表单的逻辑：

   use Backend\Behaviors\ListController;
   use Backend\Behaviors\FormController;
   
   class YourModel extends Controller
   {
       public $implement = [
           ListController::class,
           FormController::class
       ];
   
       // 配置列表和表单的yaml文件路径
       public $listConfig = 'config_list.yaml';
       public $formConfig = 'config_form.yaml';
   
       // ... 其他控制器逻辑
   }
   

2. 创建自定义视图文件
   在控制器的视图目录下（比如plugins/yourvendor/yourplugin/controllers/yourmodel/），创建或修改index.htm文件，同时渲染列表和表单的部分视图：

   <div class="row">
       <!-- 列表区域，占8列 -->
       <div class="col-md-8">
           {% partial '@list.htm' %}
       </div>
       <!-- 表单区域，占4列 -->
       <div class="col-md-4">
           {% partial '@form.htm' %}
       </div>
   </div>
   

   这里用了Bootstrap的网格系统让列表和表单并排，你也可以改成上下排列，或者调整列宽来适配你的需求。

3. 更新控制器的index方法
   在控制器的index方法里，初始化列表和表单的逻辑，并返回自定义视图：

   public function index()
   {
       $this->pageTitle = '数据管理';
       // 初始化列表和表单组件
       $this->listRender();
       $this->formRender();
       // 返回自定义视图
       return $this->makePartial('index');
   }
   

方法二：使用标签页切换（同一页面分栏展示） #

如果你不想让列表和表单同时显示，也可以用标签页把它们放在同一页面，用户可以切换查看：

在自定义的index.htm视图里加入标签页结构：

<ul class="nav nav-tabs" role="tablist">
    <li class="active"><a href="#list-tab" role="tab" data-toggle="tab">数据列表</a></li>
    <li><a href="#form-tab" role="tab" data-toggle="tab">添加/编辑数据</a></li>
</ul>
<div class="tab-content">
    <div class="tab-pane active" id="list-tab">
        {% partial '@list.htm' %}
    </div>
    <div class="tab-pane" id="form-tab">
        {% partial '@form.htm' %}
    </div>
</div>

这种方式既保持了页面的整洁，又解决了空白过多的问题。

注意事项 #

• 表单提交逻辑：确保控制器的create、update等方法能正常处理表单提交，提交后可以刷新页面或跳回当前页，保证用户体验。
• 样式调整：如果默认样式不够美观，可以添加自定义CSS来调整间距、布局，让页面更紧凑。
• 权限控制：确保当前用户同时拥有列表查看和表单编辑的权限，避免出现功能无法使用的情况。

内容的提问来源于stack exchange，提问作者Isral Bustami