【问题标题】:Getting trouble while trying Dynamic Data in jsPdf AutoTable在 jsPdf AutoTable 中尝试动态数据时遇到问题
【发布时间】:2016-07-25 06:36:20
【问题描述】:

我正在尝试使用 jsPdf AutoTable 将动态数据打印到 PDF 中。但我没有这样做。我在许多网站上搜索过,但没有人没有提到动态数据进入 Row 的。所以在这里我的问题是,有没有办法将动态数据放入表格行中,如果有人可以澄清我的话。注意:[这里没有使用 HTML 将数据存储到 Pdf 中,我直接从 js 获取数据]。

this.print=function(){
        	{
        		
        		var mainData =this.printData(); // Here am getting Full Json data Here
        		var steps = mainData.steps;   // From that data am Separating what i need
        		var criticality = mainData.criticality;
        		var categories = mainData.categories;
        		var checkup = mainData.checkup;
        		
            // This is For to Take the Steps Data alone
               $scope.getSteps = function(steps) {
                   var data = [];
                   for (var i = steps.length; i-- > 0;) {
                     data.push(steps[i].name+"\n"+"\n");
                   }
                   return data;
                 }
               
                     // Like wise am getting every single object data's 
                  $scope.getNumbersOfSubSteps = function(steps) {
                   var data = 0;
                   for (var i = 0 ; i < steps.length; i++) {
                     for (var j = 0; j<steps[i].steps.length; j++) {
                      }
                     data = j ;
                   }
                   return data;
                 }

                 // this is for Sub Proceeses
                 $scope.getSubProcesses = function(steps) {
                   var data = [];
                   for (var i = 0 ; i < steps.length; i++) {
                      for (var j = 0; j<steps[i].steps.length; j++) {
                          data.push(steps[i].steps[j].name+"\n");                  
                     }
                   }
                   return data;
                 }
                 
                  $scope.getCategories = function(categories) {
                   var data = [];
                   for (var i = categories.length; i-- > 0;) {
                     data.push(categories[i].name+"\n");
                   }
                   return data;
                 } 
                  
                  $scope.getCriticality = function(criticality) {
                   var data = [];
                   for (var i = criticality.length; i-- > 0;) {
                     data.push(criticality[i].name+"\n");
                   }
                   return data;
                 }
         
                 // Pdf Print Function Begins 
                  
                var columns = ["ProcessDescription", "Steps", "#ofSubProcesses", "SubSteps","Category","Criticality","CheckUp"];
                var processDescription =mainData.description;
                var processes= $scope.getSteps(steps);
                var NoOfSubProcess = $scope.getNumbersOfSubSteps(steps);
                var subProcesses = $scope.getSubProcesses(steps);
                console.log('Subprocsses length',subProcesses);
                var categories = $scope.getCategories(categories);
                var criticality = $scope.getCriticality(criticality);
                
                // The Problem Begins here , Am struggling to Get the Separate data's here !
                var rows = [
                                    [processDescription,processes,NoOfSubProcess,subProcesses,categories,criticality]
                            
                             ];
                
                var pdfsize='a1';
                var doc = new jsPDF('p', 'pt',pdfsize);
     
                doc.autoTable(columns, rows, {
                	theme: 'striped', // 'striped', 'grid' or 'plain'
                	styles: {
                	      overflow: 'linebreak',
                	      columnWidth: 'wrap'
                	    },
                	    beforePageContent: function(data) {
                	        doc.text("Process Name :"+mainData.name, 40, 30);
                	    },
                    columnStyles: {
                      1: {columnWidth: 'auto'}
                    }
                  });

                  doc.save(mainData.name+ pdfsize +".pdf");
            }
          	
       	
          
        };

【问题讨论】:

  • 动态数据是什么意思?例如,您可以在调用 autotable 之前使用循环构造行对象吗?
  • 动态数据均值,var processes = $scope.getSteps(steps); --> 这个进程有三个进程,所以如果我在该行中使用进程,它会在同一个单元格中打印三个数据,
  • 您必须将流程转换为与 autotable 使用的格式匹配的格式。如果您查看存储库,则存储库中有一个示例/examples.js 文件,如果您使用动态数据需要指针。
  • 我尝试 for 循环来命中行中的数据,但它没有反映。
  • 你使用了 someWhere 的 getData() 对吗?让我检查一下并更新你,谢谢兄弟:)

标签: javascript jquery jspdf jspdf-autotable


【解决方案1】:

你需要替换这个:

var rows = [
    [processDescription,processes,NoOfSubProcess,subProcesses,categories,criticality]
];

类似这样的:

var rows = [];
for (var k = 0 ; k < processes.length; k++) {
    rows.push([
        processDescription,
        processes[k],
        NoOfSubProcess,
        subProcesses[k],
        categories[k],
        criticality[k]
    ]);
};

rows 参数应该是一个数组数组。如果我理解正确的话,你放在那里的基本上是一个数组数组。

【讨论】:

猜你喜欢
  • 2017-08-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-05-24
  • 2022-01-24
  • 1970-01-01
  • 2017-11-27
  • 1970-01-01
相关资源
最近更新 更多