title: Vue-tables-2 create .pdf (pdfmake) 'malformed table row' error
body: <p>I am close to being able to download a <code>.pdf</code> file of multiple selected (checkboxes) rows in <code>vue-tables-2</code> datatables.</p>
  
  <p>In my code I am pushing <code>this.checkedRows</code> to <code>table.body</code> for both the headers columns and this.checkedRows content .... a checkbox input and <code>'sku'</code> which is a string. Here is my code:</p>
  
  <pre><code>&lt;template&gt;
      &lt;el-container&gt;
          &lt;side-nav&gt;&lt;/side-nav&gt;
          &lt;el-main&gt;
              &lt;v-server-table url="/getListings" :data="tableData" :columns="columns" :options="options"&gt;
                  &lt;input slot="selected" slot-scope="props" type="checkbox" :checked="props.row.selected" v-model="checkedRows" :value="props.row"&gt;
                  &lt;button slot="afterFilter" type="button" class="btn btn-primary btn-pdf" @click="createPDF"&gt;Create Purchase Order&lt;/button&gt;
              &lt;/v-server-table&gt;
          &lt;/el-main&gt;
      &lt;/el-container&gt;
  &lt;/template&gt;
  
  
  &lt;script&gt;
  
  import {ServerTable, Event} from 'vue-tables-2';    
  Vue.use(ServerTable, {}, false, 'bootstrap4');
  
  var pdfMake = require('pdfmake/build/pdfmake.js');
      var pdfFonts = require('pdfmake/build/vfs_fonts.js');
      pdfMake.vfs = pdfFonts.pdfMake.vfs;
  
  export default {
      data() {
          return {
              toggle:[],
              tableData: [],
              checkedRows: [],
              columns: [
                  'selected',
                  'sku',
              ],     
              options: {
  
              }
          }
      },
  
      methods: {
  
          createPDF() {
              var docDefinition = {
              content: [
                  {
                      table: {
                          headerRows: 1,
                          widths: [ 'auto', 'auto' ],
  
                          body: [
  
                          ]
                      }
                  }
              ]
              };
              docDefinition.content[0].table.body.push(this.columns);
              for(var i=0;i&lt;this.checkedRows.length;i++){
                  docDefinition.content[0].table.body.push(Object.values(this.checkedRows[i]));  
              }
              pdfMake.createPdf(docDefinition).download('PO.pdf');
          }            
      }
  }
  
  &lt;/script&gt;
  </code></pre>
  
  <p>The issue is in the mismatch of 2 header columns 'selected', and 'sku' and 1 column of row data {'sku#'} where I am getting a <em><code>'malformed table row error'</code></em> as well as a <em><code>'cell is undefined'</code></em> error.   Here are the errors:</p>
  
  <p><a href="https://i.stack.imgur.com/cHmmP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/cHmmP.png" alt="enter image description here"></a></p>
  
  <p><a href="https://i.stack.imgur.com/XfCHr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/XfCHr.png" alt="enter image description here"></a></p>
  
  <p><a href="https://i.stack.imgur.com/47f7X.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/47f7X.png" alt="enter image description here"></a></p>
  
  <p>I actually don't need the checkbox <code>selected</code> column in the <code>.pdf</code>, but I don't know how to only include the needed <em>header columns</em> like <code>sku</code> etc., and leave out the <code>selected</code> header column.</p>