使用fastadmin框架实现在线编辑功能

已于 2023-06-21 09:51:20 修改
阅读量819 收藏 1
点赞数
分类专栏： PHP 文章标签： html javascript php
于 2023-04-01 10:54:31 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_68862343/article/details/129893664
版权

目录

首先需要进入到编辑页面，在编辑页面需要渲染选中的想要编辑修改的数据或者全部数据到对应的input框

在编辑页面中进行渲染：

之所以渲染时的name属性值要加一个[]，是因为在提交时这样会返回一个数组的形式

数组的长度是根据数据的条数来决定的，这样在接收到后进行转换再插入数据表即可：

在开发薪资管理时可能使用在线编辑功能一次性编辑多条数据会很方便，那么下面把实现思路以及demo分享出来：

首先需要进入到编辑页面，在编辑页面需要渲染选中的想要编辑修改的数据或者全部数据到对应的input框

     /**
     * 在线编辑列表页
     * 我这里是获取的全部数据
     * 在编辑页面中全部渲染到input
     */
    public function editdata(){
        if($this->request->isGet()){
            $res = $this->model->alias('a')
            ->join('items b','a.item_id=b.id')
            ->join('staff c','a.staff_id=c.id')
            ->join('form d','b.form_id=d.id')
            ->field('a.*,b.name,c.staff_name,c.zjhm,d.form_name')->select();
            $this->assign('res',$res);
            return $this->view->fetch();
        }
    }

在编辑页面中进行渲染：

<div class="panel panel-default panel-intro">
    {:build_heading()}
    <div class="panel-body">
        <div id="myTabContent" class="tab-content">
            <div class="tab-pane fade active in" id="one">
                <div class="widget-body no-padding"  style="overflow: scroll;">
                    <div id="toolbar" class="toolbar">
                    </div>
                    <table id="table" class="table table-striped table-bordered table-hover table-nowrap">
                        <thead><tr>
                            <th>ID</th>
                            <th>姓名</th>
                            <th>证件号码</th>
                            <th>一号</th>
                            <th>二号</th>
                            <th>三号</th>
                            <th>四号</th>
                            <th>五号</th>
                            <th>六号</th>
                            <th>七号</th>
                            <th>八号</th>
                            <th>九号</th>
                            <th>十号</th>
                            <th>十一号</th>
                            <th>十二号</th>
                            <th>十三号</th>
                            <th>十四号</th>
                            <th>十五号</th>
                            <th>十六号</th>
                            <th>十七号</th>
                            <th>十八号</th>
                            <th>十九号</th>
                            <th>二十号</th>
                            <th>二十一号</th>
                            <th>二十二号</th>
                            <th>二十三号</th>
                            <th>二十四号</th>
                            <th>二十五号</th>
                            <th>二十六号</th>
                            <th>二十七号</th>
                            <th>二十八号</th>
                            <th>二十九号</th>
                            <th>三十号</th>
                            <th>三十一号</th>
                            <th>项目部</th>
                            <th>公司</th>
                        </tr></thead>
                        <tbody>
                            <form action="editsub" method="post">
                            <button type="submit" class="btn btn-primary btn-embossed">{:__('OK')}</button>
                            {volist name="res" id="vo"}
                            <tr>
                            <td><input type="text" name="id[]" value="{$vo.id}" style="width: 50px;border: none;outline: none;" readonly></td>
                            <td><input type="text" value="{$vo.staff_name}" style="width: auto;border: none;outline: none;" readonly></td>
                            <td><input type="text" value="{$vo.zjhm}" style="width: auto;border: none;outline: none;" readonly></td>
                            <td><input type="text" name="first[]" value="{$vo.first}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="second[]" value="{$vo.second}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="third[]" value="{$vo.third}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="fourth[]" value="{$vo.fourth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="fifth[]" value="{$vo.fifth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="sixth[]" value="{$vo.sixth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="seventh[]" value="{$vo.seventh}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="eighth[]" value="{$vo.eighth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="ninth[]" value="{$vo.ninth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="tenth[]" value="{$vo.tenth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="eleventh[]" value="{$vo.eleventh}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="twelfth[]" value="{$vo.twelfth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="thirteenth[]" value="{$vo.thirteenth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="fourteenth[]" value="{$vo.fourteenth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="fifteenth[]" value="{$vo.fifteenth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="sixteenth[]" value="{$vo.sixteenth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="seventeenth[]" value="{$vo.seventeenth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="eighteenth[]" value="{$vo.eighteenth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="nineteenth[]" value="{$vo.nineteenth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="twentieth[]" value="{$vo.twentieth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="twenty_first[]" value="{$vo.twenty_first}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="twenty_second[]" value="{$vo.twenty_second}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="twenty_third[]" value="{$vo.twenty_third}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="twenty_fourth[]" value="{$vo.twenty_fourth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="twenty_fifth[]" value="{$vo.twenty_fifth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="twenty_sixth[]" value="{$vo.twenty_sixth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="twenty_seventh[]" value="{$vo.twenty_seventh}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="twenty_eighth[]" value="{$vo.twenty_eighth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="twenty_ninth[]" value="{$vo.twenty_ninth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="thirtieth[]" value="{$vo.thirtieth}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" name="thirty_first[]" value="{$vo.thirty_first}" style="width: 50px;border: none;outline: none;"></td>
                            <td><input type="text" value="{$vo.name}" style="width: 50px;border: none;outline: none;" readonly></td>
                            <td><input type="text" value="{$vo.form_name}" style="border: none;outline: none;" readonly></td>
                            </tr>
                            {/volist}
                        </form>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

我这里是自己写的行内样式，如果有更好的方法希望有大佬可以指教一下，在页面上是这样显示的：

之所以渲染时的name属性值要加一个[]，是因为在提交时这样会返回一个数组的形式

数组的长度是根据数据的条数来决定的，这样在接收到后进行转换再插入数据表即可：

 /**
     * 在线编辑提交
     */
    public function editsub(){
        if($this->request->isPost()){
            $datas = input('post.');// 获取到全部的数据
            // 随便挑一个字段进行循环，将其进行转换，数组的长度是一样的
            for($i = 0;$i < count($datas['id']);$i++){
                $data[$i]['id'] = $datas['id'][$i];
                $data[$i]['first'] = $datas['first'][$i];
                $data[$i]['second'] = $datas['second'][$i];
                $data[$i]['third'] = $datas['third'][$i];
                $data[$i]['fourth'] = $datas['fourth'][$i];
                $data[$i]['fifth'] = $datas['fifth'][$i];
                $data[$i]['sixth'] = $datas['sixth'][$i];
                $data[$i]['seventh'] = $datas['seventh'][$i];
                $data[$i]['eighth'] = $datas['eighth'][$i];
                $data[$i]['ninth'] = $datas['ninth'][$i];
                $data[$i]['tenth'] = $datas['tenth'][$i];
                $data[$i]['eleventh'] = $datas['eleventh'][$i];
                $data[$i]['twelfth'] = $datas['twelfth'][$i];
                $data[$i]['thirteenth'] = $datas['thirteenth'][$i];
                $data[$i]['fourteenth'] = $datas['fourteenth'][$i];
                $data[$i]['fifteenth'] = $datas['fifteenth'][$i];
                $data[$i]['sixteenth'] = $datas['sixteenth'][$i];
                $data[$i]['seventeenth'] = $datas['seventeenth'][$i];
                $data[$i]['eighteenth'] = $datas['eighteenth'][$i];
                $data[$i]['nineteenth'] = $datas['nineteenth'][$i];
                $data[$i]['twentieth'] = $datas['twentieth'][$i];
                $data[$i]['twenty_first'] = $datas['twenty_first'][$i];
                $data[$i]['twenty_second'] = $datas['twenty_second'][$i];
                $data[$i]['twenty_third'] = $datas['twenty_third'][$i];
                $data[$i]['twenty_fourth'] = $datas['twenty_fourth'][$i];
                $data[$i]['twenty_fifth'] = $datas['twenty_fifth'][$i];
                $data[$i]['twenty_sixth'] = $datas['twenty_sixth'][$i];
                $data[$i]['twenty_seventh'] = $datas['twenty_seventh'][$i];
                $data[$i]['twenty_eighth'] = $datas['twenty_eighth'][$i];
                $data[$i]['twenty_ninth'] = $datas['twenty_ninth'][$i];
                $data[$i]['thirtieth'] = $datas['thirtieth'][$i];
                $data[$i]['thirty_first'] = $datas['thirty_first'][$i];
            }
        try {
            foreach($data as $k => $v){
                $res = $this->model->where('id',$v['id'])->update($v);
                if($res){//修改成功的数据
                    array_push($succ,$v);
                }else{//修改失败的数据
                    array_push($erro,$v);
                }
            }
            // 将具体的成功失败的数据放入，可以将其返回到前端
            $datas = [
                'success'=>$succ,
                'error'=>$erro
            ];
            $this->success('共'.count($data).'条数据，成功'.count($succ).'条数据，失败'.count($erro).'条数据','index');
        } catch (\Throwable $th) {
            throw $th;
        }
        }
    }

我这里最后写了一个具体多少条数据，成功失败各多少条，看各自需求了，希望对大家有所帮助

不掉头发！
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Fastadmin后台插件-在线命令管理-getshell
千寻的博客
05-09 3622
注意：需要登录账号或者自己上传一个压缩包，存在漏洞的版本是1.1.0，经过测试1.1.1的已经对输入的进行过滤。我们在接口生成文件处填入 php 的文件名，在文档标题处填入 php 文件。插件管理–在线命令管理—的插件可以直接命令执行。第一步 先上传一个phpinfo,提示成功。第二步 上传一个eval。
fastadmin 行内无刷新编辑editable插件使用方法详解
赵一舟的博客
07-19 1003
后台插件安装好后，只用设置js即可。
【FastAdmin开发记录】可编辑表格
最新发布
悟道参禅
05-11 203
FastAdmin表格无刷新行内编辑插件，editable
fastadmin后台集成ace在线代码编辑器
weixin_39347356的博客
01-06 594
ace包在这：https://download.csdn.net/download/weixin_39347356/74370374 官方Git：https://github.com/ajaxorg/ace/ 放到对应页面对应js中的api bindevent中 <div class="form-group"> <label class="control-label col-xs-12 col-sm-2">{:__('Content')}:</label&g
知识笔记（五十七）———fastadmin编辑方法
lrx276的博客
12-13 565
然后通过引入的 Db来进行编辑方法的实现。首先，要引入 think\Db;通过一些方法来进行编辑。
FastsAdmin 快速的后台，永远滴神。在线命令管理增加后台的菜单，功能。
hzhairuntao的博客
05-17 2551
1.先安装后台《在线命令管理》，新版是有这个插件的，没有的话，看官方手册，可以在cmd里面操作，我这里就不写cmd的操作了， 2.创建数据表，我这边简单创建一个博客表 3.先生成CRUD，选择刚刚新建的blog表 4.定义控制器名和模型名称，建议和表名一样，选择显示字段的这里，一般就默认就行了，切记，自己选的时候，ID字段一定要选，不然就执行不了 删除 和修改操作，因为没有主键ID 5.字段显示的样式选择 img add_time status content 这都会生成相对于的..
地图插件（fastadmin地图插件）
06-15
【地图插件（fastadmin地图插件）】是一款专为FastAdmin框架设计的高效地图集成工具，它提供了对高德地图、百度地图和腾讯地图的支持，极大地简化了地图功能在前端和后台的开发过程。这款插件具备智能搜索、经纬度...
PHP-ThinkPHP5-FastAdmin-CMS系统
01-09
【PHP-ThinkPHP5-FastAdmin-CMS系统】是一个基于PHP开发的内容管理系统，它利用了流行的ThinkPHP5框架和FastAdmin后台框架。这个系统旨在提供一个高效、易用且功能丰富的平台，用于快速构建企业级的Web应用。下面将...
fastadmin editable行内编辑
09-03
标题中的“fastadmin editable行内编辑”指的是FastAdmin框架中的一种功能特性，即在数据列表中实现行内编辑。FastAdmin是一款基于ThinkPHP6开发的后台管理框架，它提供了丰富的功能和优秀的用户体验，其中行内编辑...
Fastadmin 语言通知插件
09-30
3. **事件驱动**：在Fastadmin框架中，事件机制是实现动态功能的重要手段。语言通知插件可能会监听特定的系统事件，如用户操作、订单状态改变等，当这些事件触发时，插件会自动发送相应语言的通知。 4. **用户界面*...
基于fastapi sqladmin开发，实现可动态配置admin
05-11
FastAPI是一个现代化、高性能的Web框架，用于构建API，而SQLAdmin则是一个用于管理和操作数据库的Web界面。现在我们将深入探讨如何利用这两个工具来实现一个可动态配置的管理员系统。 FastAPI是一个基于Python的API...
Fastadmin后台管理之表格行内编辑requireJS加载x-editable.js
仗剑行于江湖，执笔记江湖事。
02-28 1300
本文也已同步发布个人博客，https://qiucode.cn/article/89 1、下载x-editable js以及css x-editable官网https://vitalets.github.io/x-editable/ 2、在require-backend.js文件添加以下内容 找到 public/assets/js/require-backend.js 文件，进行如下操作 require.config({ ..., ..., paths: { ...,
fastadmin 在线命令行 提示只允许在开发环境执行命令
夏已微凉、
01-01 3464
fastadmin 在线命令行 提示只允许在开发环境执行命令
fastadmin table 列表中的编辑和删除 确定后回调
jim的博客
05-09 610
【代码】fastadmin table 列表中的编辑和删除 确定后回调。
开发日志 fastadmin js 编辑按钮点击事件修改弹窗为同个窗口打开 thinkphp php开发
10-16 690
开发日志 fastadmin js 编辑按钮点击事件修改弹窗为同个窗口打开 thinkphp php开发
Fastadmin中 表单form 绑定和提交后自定义处理方法
xxs18326183038的博客
09-15 2930
Fastadmin中 表单form 绑定和提交后自定义处理方法
fastadmin框架里基于x-editable实现的表格无刷新行内编辑功能的插件的‘datetime‘时间类型无法使用的解决方法
lsmbh的博客
03-02 1248
问题描述： 当editable中的参数type设为为datetime的时候会出现以下报错。 Uncaught TypeError: Cannot read property 'DPGlobal' of undefined 原因分析： 在bootstrap-editable.js和bootstrap-editable.css文件中没有引入datetimepicker资源文件 解决方案： 1.在bootstrap-editable.css文件尾部写入 /*! * Datetimepicke
fastadmin的模板中， ＜script id=“customformtpl“ type=“text/html“＞ 自定义模板代码如何使用 ？
写写代码
05-01 978
需要注意的是，使用自定义表单模板需要对模板引擎使用较为熟练，以免引起页面渲染问题。在编写自定义表单模板的过程中，可以参考FastAdmin系统自带的表单模板进行参考。当需要在FastAdmin系统中添加或编辑此模型的数据时，会使用设置的自定义表单模板来渲染表单。这些标记都是通过模板引擎语法进行处理的，因此可以根据自己的需求进行修改。在FastAdmin后台管理系统的模板管理中，找到需要自定义表单模板的模型所使用的模板。语法来获取表单中的字段值，并使用模板引擎语法进行处理。在自定义表单模板代码中，可以使用。
FastAdmin使用手册：安装与功能详解
"fastadmin.pdf 是一份中文说明文档，详细介绍了 FastAdmin 框架的使用方法、安装过程以及各种功能。FastAdmin 是基于 ThinkPHP6 的后台管理系统，提供了丰富的功能模块，包括一键生成 CRUD、菜单、API 文档、插件...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值