layui数据表格里面加进度条,进度条的进度需要异步获取后台数据来显示进度

table.render({
            elem: '#downs',
            height: 600,
            url: '/Model/getdown111.php', //数据接口
            method: 'POST',
            where: {
                'orderId': orderId,
                'ac': 'query',
                'r': ram
            },
            page: true, //开启分页
            id: 'idTest',//设置表格id以便重载表格调用
            cols: [[ //表头
                {field: 'zizeng', title: '序号', fixed: 'left', templet: '#zizeng', width: 80},
                {field: 'id', title: 'downid', fixed: 'left', width: 80},
                {field: 'title', title: '资源名称', fixed: 'left'},
                {field: 'geturl', title: '资源网址', fixed: 'left'},
                {
                    field: 'pro',
                    title: '下载进度',
                    fixed: 'left',                  
                    templet: function (d) { 
                            var scanTime = 5000; //定义扫描时间
                            var sendtime = 1;
                            var timer = setInterval(function () { //进度条方法查看进度
                                var r = Math.random() * 11;
                                $.ajax({
                                    url: '/Model/getdown111.php', //数据接口
                                    type: 'POST',
                                    dataType: 'json',
                                    data: {
                                        'orderId': orderId,
                                        'downid': d.id,
                                        'ac': 'godown',
                                        'sendtime': sendtime,
                                        'r': r
                                    },
                                    success: function (data) {
                                        sendtime++;
                                        console.log(data.percent);
                                        var progress = '<div class="layui-progress layui-progress-big" lay-showpercent="true">';
                                        progress += '<div class="layui-progress-bar layui-bg-red" lay-percent="' + data.percent + '%"></div>';
                                        progress += '</div>';
                                        console.log(progress);
                                        return progress;
                                        if (data.percent == 100) {
                                            clearInterval(timer); //进度到100%,注意关闭定时器
                                            return '<div class="layui-progress layui-progress-big" lay-showpercent="true"><div class="layui-progress-bar layui-bg-blue" lay-percent=100%></div></div>'

                                        }
                                    },
                                    error: function (e) {
                                        console.log(e);

                                    }
                                });
                            }, scanTime);
                    }
                },

               
            ]],
            done: function (res, curr, count) {
                element.render('progress');
            }

        });
    });

ajax能正常显示信息,但是数据表格的进度条显示是undefied,求大神帮忙看看是啥原因,自己实在研究不出来了

ajax的success return progress;这个没用,没有接受者。不知道你用的什么框架,如果异步获取参数,templet应该有回调什么的,如参数d是函数,通过d函数来处理ajax的返回值。

 

目测templet必须要要返回一些html代码之类的,由于templet没有返回内容所以默认返回的是undefined,直接显示undefined内容了

 

请问发的异步请求的后端代码有吗?想参考参考

您好,我也遇到该问题了,请问一下您解决了吗