技术心得:前端点击按钮,导入excel文件,上传到后台,excel接收和更新数据

简介: 技术心得:前端点击按钮,导入excel文件,上传到后台,excel接收和更新数据

[/span>extend name="Public:public"/>


[/span>block name="admin"

[/span>div class="main-content"

[/span>div class="container-fluid"


[/span>div class="container-fluid"

[/span>div class="row"


[/span>div class="panel"

[/span>div class="panel-heading"

[/span>h3 class="panel-title"


[/span>div class="panel-body"

[/span>form class="form-inline" id="searchForm" method="post" action="{:U('XmrechargeBuyerAccount/index')}"

[/span>div class="form-group" style="margin-left: 20px; margin-top: 25px"

[/span>label for="merchant_no" style="width: 100px"

[/span>input style="width: 245px" type="text" name="account" class="form-control" id="account" placeholder="请输入备注" value="{$params【'desc'】}"


[/span>div class="form-group" style="margin-left: 20px; margin-top: 25px"

[/span>label for="platform_type"

[/span>select style="width: 200px" class="selectbox form-control" id="status" name="status"

[/span>option value=""

[/span>option value="1"

[/span>option value="2"



[/span>div style="float: right;margin-top:23px"
//代码参考:https://weibo.com/u/7931859757

[/span>select class="selectbox1" onchange="changeLimit()" id="pid" name="size" style="padding: 6px 12px;background-color: #fff;border: 1px solid #ccc;border-radius: 4px;"

[/span>option grade='10' value="10"

[/span>option grade='25' value="25"

[/span>option grade='50' value="50"

[/span>option grade='100' value="100"



[/span>a href="MODULE/XmrechargeBuyerAccount/add"div style="margin-left: 10px;" class="btn btn-info"

[/span>button style="margin-left: 10px;" type="submit" class="btn btn-info"

[/span>button style="margin-left: 10px;" type="button" class="btn btn-success" onclick="batch()"

批量导入手机账号


批量禁用


批量启用


批量删除


#第一步 设置按钮,然后点击方法


#第二步设置打开窗口layui


#第三步把隐藏的div盒子显示处理,并且写好div布局


#第四步提交文件内容





[/span>div class="panel-body"

[/span>table class="table table-striped table-bordered "

[/span>thead

[/span>tr

[/span>th style="width: 14%"

[/span>th style="width: 14%"

[/span>th style="width: 14%"

[/span>th style="width: 14%"

[/span>th style="width: 16%"



[/span>tbody class="listTd"

[/span>if condition="empty($list)"

[/span>tr class="even gradeC "td colspan="10" align="center" Height</span>="50px"

[/span>else />


[/span>volist name="list" id="litem"

[/span>tr class="even gradeC "

[/span>td style="line-height: 40px;"

[/span>td style="line-height: 40px;"

[/span>td style="line-height: 40px;"

[/span>td style="line-height: 40px;"

[/span>td

[/span>a href="MODULE/XmrechargeBuyerAccount/edit?id={$litem【'id'】}"button class="btn btn-info" href style="margin-top:5px;"

<?php if($litem【'status'】 == 1){ ?>


[/span>a href="javascript:void(0)" onclick="unseleve({$litem【'id'】},2,'禁用')"button class="btn btn-danger" href style="margin-top:5px;"

<?php }else{ ?>


[/span>a href="javascript:void(0)" onclick="unseleve({$litem【'id'】},1,'启用')"button class="btn btn-info" href style="margin-top:5px;"

<?php } ?>


[/span>a href="javascript:void(0)" onclick="delAccount({$litem【'id'】})"button class="btn btn-danger" href style="margin-top:5px;"

[/span>a href="javascript:void(0)" onclick="synchronization({$litem【'id'】})" button class="btn btn-info" href style="margin-top:5px;"


相关文章
|
2月前
|
前端开发 Java 物联网
智慧班牌源码,采用Java + Spring Boot后端框架,搭配Vue2前端技术,支持SaaS云部署
智慧班牌系统是一款基于信息化与物联网技术的校园管理工具,集成电子屏显示、人脸识别及数据交互功能,实现班级信息展示、智能考勤与家校互通。系统采用Java + Spring Boot后端框架,搭配Vue2前端技术,支持SaaS云部署与私有化定制。核心功能涵盖信息发布、考勤管理、教务处理及数据分析,助力校园文化建设与教学优化。其综合性和可扩展性有效打破数据孤岛,提升交互体验并降低管理成本,适用于日常教学、考试管理和应急场景,为智慧校园建设提供全面解决方案。
274 70
|
7月前
|
存储 监控 安全
前端框架的数据驱动方式如何保证数据的安全性?
总之,前端框架的数据驱动方式需要综合运用多种手段来保证数据的安全性。从传输、存储、访问控制到防范攻击等各个方面进行全面考虑和实施,以确保用户数据的安全可靠。同时,不断加强安全管理和技术创新,以应对不断变化的安全挑战。
239 60
|
7月前
|
前端开发 JavaScript 测试技术
前端测试技术中,如何提高集成测试的效率?
前端测试技术中,如何提高集成测试的效率?
|
3月前
|
前端开发 Cloud Native Java
Java||Springboot读取本地目录的文件和文件结构,读取服务器文档目录数据供前端渲染的API实现
博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
Java||Springboot读取本地目录的文件和文件结构,读取服务器文档目录数据供前端渲染的API实现
|
4月前
|
前端开发 Java Shell
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
293 20
【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
|
6月前
|
存储 Java easyexcel
招行面试:100万级别数据的Excel,如何秒级导入到数据库?
本文由40岁老架构师尼恩撰写,分享了应对招商银行Java后端面试绝命12题的经验。文章详细介绍了如何通过系统化准备,在面试中展示强大的技术实力。针对百万级数据的Excel导入难题,尼恩推荐使用阿里巴巴开源的EasyExcel框架,并结合高性能分片读取、Disruptor队列缓冲和高并发批量写入的架构方案,实现高效的数据处理。此外,文章还提供了完整的代码示例和配置说明,帮助读者快速掌握相关技能。建议读者参考《尼恩Java面试宝典PDF》进行系统化刷题,提升面试竞争力。关注公众号【技术自由圈】可获取更多技术资源和指导。
|
7月前
|
前端开发 JavaScript API
惊呆了!这些前端技术竟然能让你的网站实现无缝滚动效果!
【10月更文挑战第30天】本文介绍了几种实现网页无缝滚动的技术,包括CSS3的`scroll-snap`属性、JavaScript的Intersection Observer API以及现代前端框架如React和Vue的动画库。通过示例代码展示了如何使用这些技术,帮助开发者轻松实现流畅的滚动效果,提升用户体验。
649 29
|
7月前
|
前端开发 JavaScript 搜索推荐
HTML与CSS在Web组件化中的核心作用及前端技术趋势
本文探讨了HTML与CSS在Web组件化中的核心作用及前端技术趋势。从结构定义、语义化到样式封装与布局控制,两者不仅提升了代码复用率和可维护性,还通过响应式设计、动态样式等技术增强了用户体验。面对兼容性、代码复杂度等挑战,文章提出了相应的解决策略,强调了持续创新的重要性,旨在构建高效、灵活的Web应用。
124 6
|
7月前
|
前端开发 JavaScript 搜索推荐
前端懒加载:提升页面性能的关键技术
前端懒加载是一种优化网页加载速度的技术,通过延迟加载非首屏内容,减少初始加载时间,提高用户访问体验和页面性能。
|
7月前
|
缓存 JavaScript 前端开发
JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用
本文深入讲解了 JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用。
221 5

热门文章

最新文章