zoukankan      html  css  js  c++  java
  • jQuery动态生成table

    function loadDoc() {
                //var $DbPlantCode = ;
                //var $texWo = $("#texWo").val();
                //var $data = { DBplantCode: $DbPlantCode, Strgroup: $Group, tempPNs: $txtPN, dateS: $dateS, dateE: $dateE }
                var $Results = $('#Results');//获取页面上id为tableId的table对象
                
                $("#Results").empty(""); //清空table
                var tableStr;//定义一个用来拼表格内容的字符串
                jQuery.support.cors = true;
    
                $.ajax({
                    async:true,
                    type: 'POST',
                    url: BaseUrl+ 'api/yield/yield_Oper',
                    //url: 'http://10.67.50.80/TJWebApi/api/yield/yield_Oper',               
                    contentType: "application/json;charset=utf-8", //json格式传给后端
                    data:JSON.stringify({
                        DBcode: $("#DBplantCode").val(),
                        PlantCode:'Static',
                        WorkOrderNo: $("#texWo").val()
                    }),                
                    dataType: "json",//数据返回格式
                    //dataType: "jsonp",
                    success: function (data) {
                        console.log(data);
                        //表头
                        var $tableHeader = new Array('eventname','total','firstinput','repairinput','firstpass','firstfail','retestpass','fianllyfail','First Pass Rate','Fail Rate')
                        var $tr = null;
                        $tableHeader.forEach(element => {                       
                            $tr = $tr + "<td>"+ element +"</td>";
                        });
                        $tr= "<tr>"+$tr+"</tr>";
                        $Results.append( $tr);
    
                        for( var i = 0; i < data['rows'].length; i++ ) {
                            //动态创建一个tr行标签,并且转换成jQuery对象
                            var $trTemp = $("<tr></tr>");
                            //往行里面追加 td单元格
                            $trTemp.append("<td>"+ data['rows'][i].eventname +"</td>");
                            $trTemp.append("<td>"+ data['rows'][i].total +"</td>");
                            $trTemp.append("<td>"+ data['rows'][i].firstinput +"</td>");
                            $trTemp.append("<td>"+ data['rows'][i].repairinput +"</td>");
                            $trTemp.append("<td><a href='Detail_FirstPass.html?DBcode="+$("#DBplantCode").val()+"&PlantCode=Detail_FirstPass&WorkOrderNo="+$("#texWo").val()+"&EventPoint="+data['rows'][i].eventname+"' target='_blank'>"+ data['rows'][i].firstpass +"</a></td>");                        
                            $trTemp.append("<td><a href='Detail_FirstFail.html?DBcode="+$("#DBplantCode").val()+"&PlantCode=Detail_FirstFail&WorkOrderNo="+$("#texWo").val()+"&EventPoint="+data['rows'][i].eventname+"' target='_blank'>"+ data['rows'][i].firstfail +"</a></td>");
                            $trTemp.append("<td><a href='Detail_Retest.html?DBcode="+$("#DBplantCode").val()+"&PlantCode=Detail_Retest&WorkOrderNo="+$("#texWo").val()+"&EventPoint="+data['rows'][i].eventname+"' target='_blank'>"+ data['rows'][i].retestpass +"</a></td>");
                            $trTemp.append("<td><a href='Detail_FinalFail.html?DBcode="+$("#DBplantCode").val()+"&PlantCode=Detail_FinalFail&WorkOrderNo="+$("#texWo").val()+"&EventPoint="+data['rows'][i].eventname+"' target='_blank'>"+ data['rows'][i].fianllyfail +"</a></td>");
                            $trTemp.append("<td>"+ data['rows'][i]['First Pass Rate'] +"</td>");
                            $trTemp.append("<td>"+ data['rows'][i]['Fail Rate'] +"</td>");                        
                            $trTemp.appendTo($Results);
                        }                   
                    } ,
                    error: function (err) {
                        console.log(err);
                        alert('失敗');
                    }
                });
            }
            function outEx (){
                $("#Results").table2excel({
                        exclude: ".noExl",
                        name: "Excel Document Name",
                        filename: "myFileName",
                        exclude_img: true,
                        exclude_links: true,
                        exclude_inputs: true
                    })
            }
  • 相关阅读:
    构建之法阅读笔记01
    软件工程个人作业01
    第一个PSP0级
    java实现课表的增加
    软件工程概论01
    异常处理
    流与文件课件课后作业1计算容量
    第九周课堂测试
    第八周动手动脑
    JAVA项目中常用的异常知识点总结
  • 原文地址:https://www.cnblogs.com/wangjp-1233/p/13370242.html
Copyright © 2011-2022 走看看