layui 在表格中进行文件上传

一边借鉴被人的一边改进成自己的,记录一下方便以后用到,有什么问题欢迎留言一起讨论

table.render({
			elem : '#td'
			,url : '../hkWeldingProcedureAction/findList'
			,toolbar : '#toolbar'
		    ,title: '机构表'
			,sort:true  
			,cols : [[ 
				{type : 'checkbox',width: '4%',align:'center'}
                ,{field: 'status',align:'center', title: '状态',width:'10%',templet : function (d) {
                        if (d.status =='0'){
                            return "<span style='color:red'>未审核</sapn>"
                        }else if (d.status =='1' ){
                            return "<span style='color:#3dafd6'>已审核未批准</sapn>"
                        }else if (d.status=='2'){
                            return "<span style='color:blue'>已批准</sapn>"
                        }else if (d.status=='3'){
                            return "<span style='color:#FF2E97'>已驳回</sapn>"
                        }else if (d.status=='4'){
                            return "<span style='color:#32ff5b'>未提交审核</sapn>"
                        }else if (d.status=='5'){
                            return "<span style='color:#802bc0'>审核委托中</sapn>"
                        }else if (d.status=='6'){
                            return "<span style='color:#2ff0ff'>批准委托中</sapn>"
                        }else {
                            return &
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
layui,可以使用 `upload` 组件来实现文件上传功能。以下是一个简单的示例: HTML代码: ```html <div class="layui-upload"> <button type="button" class="layui-btn" id="test-upload-normal">选择文件</button> <div class="layui-upload-list"> <table class="layui-table"> <thead> <tr><th>文件名</th><th>大小</th><th>状态</th><th>操作</th></tr> </thead> <tbody id="demo-list"></tbody> </table> </div> </div> ``` JavaScript代码: ```javascript //普通图片上传 var uploadInst = layui.upload.render({ elem: '#test-upload-normal', url: '/upload/', accept: 'file', //允许上传的文件类型 exts: 'pdf|doc|docx|xls|xlsx', //允许上传的文件后缀 size: 2048, //文件大小限制,单位 KB multiple: true, //是否允许多文件上传 done: function(res){ //上传完毕回调 console.log(res); //上传成功后,将文件信息添加表格 var tr = '<tr><td>'+ res.filename +'</td><td>'+ res.filesize +'</td><td>上传成功</td><td><button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button></td></tr>'; $('#demo-list').append(tr); }, error: function(){ //请求异常回调 console.log('上传失败'); } }); //删除已上传的文件 $(document).on('click', '.demo-delete', function(){ $(this).parents('tr').remove(); }); ``` 在上面的示例代码,我们使用了 `upload` 组件来实现文件上传功能,并且设置了一些上传参数,如 `accept`、`exts`、`size`等。上传成功后,会调用 `done` 回调函数,在回调函数将文件信息添加表格。同时,我们还实现了删除已上传文件的功能。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值