Answers

• gabrielandre Posts: 4Questions: 1Answers: 1

  February 2017 edited February 2017

  try to unminify the buttons.html5.min.js It has a clean JSON alike structure.

  here is the field:

  styles: {
  tableHeader: {
  bold: 0,
  fontSize: 11,
  color: "#595959",
  alignment: "left"
  },
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  February 2017 Answer ✓

  You don't need to unminify the file - the source code is freely available!

  The Buttons PDF export uses pdfmake for the export - you would need to refer to their documentation for information on how to customise the styling using their APIs.

  Allan
• Andreas S. Posts: 208Questions: 74Answers: 4

  February 2017

  Sorry I have some Problems with these. I think I set the vars not correct.
  I do following:

                      customize: function(doc){
                          var table_head = {};
  
                          doc['styles'] = {
                              userTable: {
                                  margin: [0, 15, 0, 15]
                              },
                              tableHeader: {
                                  bold:!0,
                                  fontSize:11,
                                  color:'black',
                                  fillColor:'#F0F8FF',
                                  alignment:'center'
                              }
                          };
                          doc['content'] = {
                              style: 'userTable',
                              layout: 'lightHorizontalLines'
                          }
  
  
  

  I think I set it correct, but I get following error:

  Unrecognized document structure: {"style":"userTable","layout":"lightHorizontalLines","_margin":[0,15,0,15]}
  

  I have no idea how can I set it and the table will print to the document.
  Andreas
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  February 2017

  I'm afraid you'd need to ask in the pdfmake support channels. I really can't help with their API as I'm not an expert in it.

  Allan
• Jewell4400 Posts: 7Questions: 1Answers: 0

  April 2017

  I needed to align PDF the table to the center I edited PDFMAKE.MIN.JS
  var y=e.text.match(c),w=e.text.match(f);e.leadingCut=y?m.widthOfString(y[0],i):0,e.trailingCut=w?m.widthOfString(w[0],i):0,e.alignment=h(e,n,"alignment","center")

  Changing only the center to get what i needed.
  NOTE:
  I had changed every COLUMN CLASS to give it the css style i wanted but they never exported.
  hope this puts you on the right track.
  AS gabrielandre got me there with his comment.
• khawley Posts: 2Questions: 0Answers: 0

  May 2017

      $('#gridID').DataTable({
          dom: 'Bfti',
          pageLength: -1,
          buttons: [
              {
                  extend: 'pdfHtml5',
                  orientation: 'landscape',
                  pageSize: 'TABLOID',
                  customize: function (doc) {
                      var tblBody = doc.content[1].table.body;
                      doc.content[1].layout = {
                      hLineWidth: function(i, node) {
                          return (i === 0 || i === node.table.body.length) ? 2 : 1;},
                      vLineWidth: function(i, node) {
                          return (i === 0 || i === node.table.widths.length) ? 2 : 1;},
                      hLineColor: function(i, node) {
                          return (i === 0 || i === node.table.body.length) ? 'black' : 'gray';},
                      vLineColor: function(i, node) {
                          return (i === 0 || i === node.table.widths.length) ? 'black' : 'gray';}
                      };
                      $('#gridID').find('tr').each(function (ix, row) {
                          var index = ix;
                          var rowElt = row;
                          $(row).find('td').each(function (ind, elt) {
                              tblBody[index][ind].border
                              if (tblBody[index][1].text == '' && tblBody[index][2].text == '') {
                                  delete tblBody[index][ind].style;
                                  tblBody[index][ind].fillColor = '#FFF9C4';
                              }
                              else
                              {
                                  if (tblBody[index][2].text == '') {
                                      delete tblBody[index][ind].style;
                                      tblBody[index][ind].fillColor = '#FFFDE7';
                                  }
                              }
                          });
                      });
                  }
              },
              'excelHtml5'],
  
• khawley Posts: 2Questions: 0Answers: 0

  May 2017

      $('#TableID').DataTable({
          dom: 'Bfti',
          pageLength: -1,
          buttons: [
              {
                  extend: 'pdfHtml5',
                  orientation: 'landscape',
                  pageSize: 'TABLOID',
                  customize: function (doc) {
                      var tblBody = doc.content[1].table.body;
                      // ***
                      //This section creates a grid border layout
                      // ***
                      doc.content[1].layout = {
                      hLineWidth: function(i, node) {
                          return (i === 0 || i === node.table.body.length) ? 2 : 1;},
                      vLineWidth: function(i, node) {
                          return (i === 0 || i === node.table.widths.length) ? 2 : 1;},
                      hLineColor: function(i, node) {
                          return (i === 0 || i === node.table.body.length) ? 'black' : 'gray';},
                      vLineColor: function(i, node) {
                          return (i === 0 || i === node.table.widths.length) ? 'black' : 'gray';}
                      };
                      // ***
                      //This section loops thru each row in table looking for where either
                      //the second or third cell is empty.
                      //If both cells empty changes rows background color to '#FFF9C4' 
                      //if only the third cell is empty changes background color to '#FFFDE7'
                      // ***
                      $('#tableID').find('tr').each(function (ix, row) {
                          var index = ix;
                          var rowElt = row;
                          $(row).find('td').each(function (ind, elt) {
                              if (tblBody[index][1].text == '' && tblBody[index][2].text == '') {
                                  delete tblBody[index][ind].style;
                                  tblBody[index][ind].fillColor = '#FFF9C4';
                              }
                              else
                              {
                                  if (tblBody[index][2].text == '') {
                                      delete tblBody[index][ind].style;
                                      tblBody[index][ind].fillColor = '#FFFDE7';
                                  }
                              }
                          });
                      });
                  }
              },
              'excelHtml5']