效果如下:
步骤1: 表设计中有字段pid;
步骤2: 控制器修改
2.1初始化Tree:
public function _initialize()
{
parent::_initialize();
$this->model = new \app\admin\model\member\Grade;
$tree = Tree::instance();
$tree->init(collection($this->model->order('weigh desc,id desc')->select())->toArray(), 'pid');
$this->categorylist = $tree->getTreeList($tree->getTreeArray(0), 'name');
$categorydata = [0 => ['id' => '0', 'name' => __('None')]];
foreach ($this->categorylist as $k => $v) {
$categorydata[$v['id']] = $v;
}
$this->view->assign("parentList", $categorydata);
}
2.2 index方法修改,,(如需查询,请自定义查询)
public function index()
{
//设置过滤方法
$this->request->filter(['strip_tags']);
if ($this->request->isAjax()) {
//构造父类select列表选项数据
$list = $this->categorylist;;
$total = count($list);
$result = array("total" => $total, "rows" => $list);
return json($result);
}
return $this->view->fetch();
}
2.3 edit方法添加判断,防止修改时 选择它的子组别或它自己作为父组件
if ($params['pid'] != $row['pid']) {
$childrenIds = Tree::instance()->init(collection(\app\common\model\Category::select())->toArray())->getChildrenIds($row['id'], true);
if (in_array($params['pid'], $childrenIds)) {
$this->error('父组别不能是它的子组别或它自己');
}
}
步骤3: 添加add.html 页面的select选择框:
<div class="form-group">
<label for="c-pid" class="control-label col-xs-12 col-sm-2">{:__('Pid')}:</label>
<div class="col-xs-12 col-sm-8">
<select id="c-pid" data-rule="required" class="form-control selectpicker" name="row[pid]">
{foreach name="parentList" item="vo"}
<option value="{$key}" {in name="key" value=""}selected{/in}>{$vo.name}</option>
{/foreach}
</select>
</div>
</div>
步骤4: 添加edit.html 页面的select选择框:
<div class="form-group">
<label for="c-pid" class="control-label col-xs-12 col-sm-2">{:__('Pid')}:</label>
<div class="col-xs-12 col-sm-8">
<select id="c-pid" data-rule="required" class="form-control selectpicker" name="row[pid]">
{foreach name="parentList" item="vo"}
<option value="{$key}" {in name="key" value="$row.pid"}selected{/in}>{$vo.name}</option>
{/foreach}
</select>
</div>
</div>
步骤4: js设置
4.1 表格字段居左
{field: 'name', title: __('Name'), align: 'left'},
4.2: js设置禁用转义,避免nbsp;不能显示空格
table.bootstrapTable({escape: false})