【Fastadmin】利用 build_select 做一个树状下拉选择框

news2024/10/6 6:03:28

1.效果展示


系统crud生成的下拉分类有些不是很好看,并且选择困难,看不出级差,效果如下:

 经过 build_select 加工后的效果,美观好看,并添加上搜索功能:

2. 首先需要写一个树状图的数据格式


protected $datalist = [];
public function _initialize()
{
    parent::_initialize();

    // 必须将结果集转换为数组
    $dataList = collection(Category::order('weigh', 'desc')->where('status', 'normal')->select())->toArray();
    foreach ($dataList as $k => &$v) {
        $v['name'] = __($v['name']);
    }
    unset($v);
    Tree::instance()->init($dataList);
    $this->dataList = Tree::instance()->getTreeList(Tree::instance()->getTreeArray(0), 'name');
    $data = [0 => __('None')];
    foreach ($this->dataList as $k => &$v) {
        $data[$v['id']] = $v['name'];
    }
    $this->view->assign('data', $data);
}

3.add和edit的html页面


// add
<div class="form-group">
    <label class="control-label col-xs-12 col-sm-2">{:__('Category')}:</label>
    <div class="col-xs-12 col-sm-8">
        {:build_select('row[category_id]', $data, null, ['class'=>'form-control selectpicker', 'required'=>'', 'data-live-search'=>"true"])}
    </div>
</div>

// edit
<div class="form-group">
    <label class="control-label col-xs-12 col-sm-2">{:__('Category')}:</label>
    <div class="col-xs-12 col-sm-8">
        {:build_select('row[category_id]', $data, $row['category_id'], ['class'=>'form-control selectpicker', 'required'=>'', 'data-live-search'=>"true"])}
    </div>
</div>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1297341.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

科学指南针走进江南大学,探索科研绘图与3D Max软件应用的精彩世界

2023年11月23日&#xff0c;江南大学迎来了一场精彩的科学指南针线下讲座&#xff0c;该讲座以探索科研绘图与3D Max软件应用为主题&#xff0c;通过专家讲座和实践操作&#xff0c;帮助学生了解科研绘图的重要性和3D Max软件在科研领域的广泛应用&#xff0c;吸引了大量感兴趣…

不一样的年会彩瞳推荐,绮芙莉多款彩瞳彰显个性

临近年底&#xff0c;各种公司年会、跨年晚会活动也逐渐排上日程&#xff0c;出席这种正式场合&#xff0c;每个人都有自己的“杀手锏”&#xff0c;从发型妆容到穿搭都是变美小细节&#xff0c;作为心灵之窗的双眸&#xff0c;更需要一副彩瞳来提升我们的眼妆质感&#xff0c;…

《树莓派不吃灰》第二十四期:懒是第一生产力,为树莓派安装可视化开源管理面板1Panel

最近有哥们推荐了一个现代化Linux开源管理面板1Panel&#xff0c;开源且稳定&#xff0c;懒是第一生产力&#xff0c;虽然命令行很灵活&#xff0c;但图形化界面真的是懒人刚需&#xff0c;本期在树莓派部署一下1Panel&#xff0c;让树莓派Linux运维更省力&#xff0c;进一步降…

主存储器与CPU的连接

目录 一. 单块存储芯片与CPU的连接二. 多块存储芯片与CPU的连接2.1 位扩展2.2 字扩展2.3 字位扩展 三. 译码器知识点的补充 \quad 一. 单块存储芯片与CPU的连接 \quad \quad \quad 暴露出的引脚都是与CPU连接的 上面这个是88位的存储芯片 我们可以看到有8个字, 每个字的字长是8…

【MATLAB源码-第99期】基于matlab的OFDM系统卡尔曼滤波(kalman)信道估计,对比LS,MMSE。

操作环境&#xff1a; MATLAB 2022a 1、算法描述 卡尔曼滤波器&#xff08;Kalman Filter&#xff09;是一种有效的递归滤波器&#xff0c;它能够从一系列的含有噪声的测量中估计动态系统的状态。在无线通信领域&#xff0c;尤其是在正交频分复用&#xff08;OFDM&#xff0…

【人工智能Ⅰ】实验7:K-means聚类实验

实验7 K-means聚类实验 一、实验目的 学习K-means算法基本原理&#xff0c;实现Iris数据聚类。 二、实验内容 应用K-means算法对iris数据集进行聚类。 三、实验结果及分析 0&#xff1a;输出数据集的基本信息 参考代码在main函数中首先打印了数据、特征名字、目标值、目标…

【C语言】操作符详解(一):进制转换,原码,反码,补码

目录 操作符分类 2进制和进制转换 2进制转10进制 10进制转2进制 2进制转8进制和16进制 2进制转8进制 2进制转16进制 原码、反码、补码 操作符分类 操作符中有一些操作符和二进制有关系&#xff0c;我们先铺垫一下二进制的和进制转换的知识。 2进制和进制转换 其实我们经…

Java+Swing: 主界面的窗体 整理8

主界面的写法跟之前登录界面的窗体写法大致相同&#xff0c;在主界面中主要是窗体的大小的设置 package com.student_view;import com.utils.DimensionUtil; import sun.applet.Main;import javax.swing.*; import java.awt.*; import java.net.URL;/*** Author&#xff1a;xie…

基于STM32 + DMA介绍,应用和步骤详解(ADC多通道)

前言 本篇博客主要学习了解DMA的工作原理和部分寄存器解析&#xff0c;针对ADC多通道来对代码部分&#xff0c;应用部分作详细讲解&#xff0c;掌握代码编程原理。本篇博客大部分是自己收集和整理&#xff0c;如有侵权请联系我删除。 本次博客开发板使用的是正点原子精英版&am…

已发表的论文职称查重率高【详细说明】

大家好&#xff0c;今天来聊聊已发表的论文职称查重率高&#xff0c;希望能给大家提供一点参考。 以下是针对论文重复率高的情况&#xff0c;提供一些修改建议和技巧&#xff1a; 已发表的论文职称查重率高 背景介绍 在学术界&#xff0c;论文的原创性和重复率是评价一篇论文质…

【安卓】安卓xTS之Media模块 学习笔记(3) VTS测试

1. 背景 接下来进行正式的VTS测试。本章节还是以Media模块相关进行介绍。 VTS主要测的是内核和HAL层&#xff0c;media的hal层是以openMax&#xff08;即将废弃&#xff0c;今日2023.12&#xff09; 和 Codec2 (后续主流) 接口为主。 这里我们只看Codec2的要求&#xff0c;CDD…

《师兄啊师兄》第二季来了!它凭什么成为修仙流里第一档?

沉寂大半年&#xff0c;修仙喜剧动画《师兄啊师兄》第二季终于“千呼万唤始出来”&#xff0c;即将在12月14日上线。作为优酷动漫本年度的当家之作&#xff0c;这部可谓是热度口碑双丰收&#xff0c;截至第一季收官&#xff0c;相关话题在短视频平台的累计播放量更是高达43亿&a…

字符串函数`strlen`、`strcpy`、`strcmp`、`strstr`、`strcat`的使用以及模拟实现

文章目录 &#x1f680;前言&#x1f680;库函数strlen✈️strlen的模拟实现 &#x1f680;库函数strcpy✈️strcpy的模拟实现 &#x1f680;strcmp✈️strcmp的模拟实现 &#x1f680;strstr✈️strstr的模拟实现 &#x1f680;strcat✈️strcat的模拟实现 &#x1f680;前言 …

OpenCV基础篇

OpenCV基础篇 一、图像、视频读取二、cv::Mat()数据类型三、绘图功能四、鼠标响应事件五、图像像素读写六、图像像素运算七、颜色空间转换八、图像几何变换九、图像滤波十、图像二值化十一、图像梯度十二、Canny边缘检测十三、图像形态学十四、图像直方图十五、霍夫变换十六、分…

jsp使用 分页专用工具

分页器&#xff0c;根据过来的参数计算当着页应当从哪一条记录开始显示&#xff0c;并且显示到哪。 PageUtils [pageSize5, currIndex1, totalCount166, totalPage34, startPosition0] PageUtils [pageSize5, currIndex5, totalCount166, totalPage34, startPosition20] PageUt…

MongoDB的删除文档、查询文档语句

本文主要介绍MongoDB的删除文档、查询文档命令语句。 目录 MongoDB删除文档MongoDB查询文档 MongoDB删除文档 MongoDB是一种基于文档的NoSQL数据库&#xff0c;它使用BSON格式存储文档。删除文档是MongoDB数据库中的常见操作之一。 下面是MongoDB删除文档的详细介绍和示例&am…

vscode创建python虚拟环境

一、创建虚拟环境 python -m venv vsvenv 二、激活虚拟环境 cd .\myvenv\Scripts.\Activate.ps1 如果出现下图所示&#xff1a; 1、使用管理员运行PowerShell 2、输入命令&#xff1a;Get-ExecutionPolicy 3、输入命令&#xff1a;Set-ExecutionPolicy RemoteSigned&…

react-photo-view 的介绍、安装、使用。

目录 基本介绍 安装 使用 基本介绍 react-photo-view 是一个基于 React 的图片查看器组件&#xff0c;用于在网页上展示和浏览图片。该组件提供了用户友好的界面和交互&#xff0c;可以轻松地在应用程序中集成并使用。 支持触摸手势&#xff0c;拖动/平移/物理效果滑动…

【数据结构第 6 章 ① 】- 图的定义和基本术语

目录 一、图的定义 二、图的基本术语 图是一种比线性表和树更为复杂的数据结构。在线性表中&#xff0c;数据元素之间仅有线性关系&#xff0c;每个数据元素只有一个直接前驱和一个直接后继&#xff1b;在树形结构中&#xff0c;数据元素之间有着明显的层次关系&#xff0c;并…