Js to get dynamic generated div ids

Question

Js to get dynamic generated div ids

I am working on java and angularjs. I have an html page that iterates an object and displays the values on the page.

html code:

<div id="{{value.pageIndex}}" ng-repeat="(key, value) in employees" class="myDivClass">
    <div>
         <h1><font color="red"> {{value.pageHeader}}</font></h1>
    </div>
    <div>
         <h1> {{value.pageIndex}}</h1>
    </div>
    <div>text from html page</div>
</div>

I should not enclose the above html code inside another div, as it will not be able to execute my other script in my application.

I want to export the content above html to PDF when the user clicks the button, the problem is when I try to get the value from the html page as shown in the js code below, only the first iterated data is exported to where I want everything Data has been exported to PDF.

js code:

$scope.export = function() {
   var pdf = new jsPDF('landscape');
    source = $('.one1');
    pdf.addHTML(source, 0, 0, {
        pagesplit: true
    },function(dispose){
        pdf.save('test.pdf');
    });
}

Please find a demo of the above scenario: https://plnkr.co/edit/6jNIu5c26ACeTPsfACX2?p=preview

, js html PDF? js PDF.

PS: html div, .

+4

javascript jquery html angularjs jspdf

user8838953 28 . '17 13:21

1

Derek Nolan · Accepted Answer · 2017-10-28T13:33:28+0000

myDivClass id.

jQuery .each() .

addend-source div html

<body>
  <div ng-controller="listController">
        <button ng-click="export()">export</button>

   <div id="{{value.pageIndex}}" ng-repeat="(key, value) in employees" class="myDivClass">
    <div>  <h1><font color="red"> {{value.pageHeader}}</font></h1> </div>
    <div><h1> {{value.pageIndex}}</h1></div>
    <div>text from html page</div>
   </div>

  </div>
  <div id="append-source"></div>
</body>

div pdf JavaScript

$scope.export = function() {
   var pdf = new jsPDF('landscape');
   var source = $('#append-source');
    $('.myDivClass').each(function(){
      var html = $(this);
      source.append(html);
    });
    console.log(source);
    pdf.addHTML(
          source, 0, 0, {
              pagesplit: true
          },
          function(dispose){
              pdf.save('test.pdf');
          }
      );
     }

Js to get dynamic generated div ids

More articles: