How to set PDF column widths using customize:

ken@kmplace.com

I'm trying to set the PDF table columns width. I see all the references to PDFMake and I have read their documentation. I see how they are doing it but I can't seem to make the connection with DataTables. All I want to do is set the table column headers and columns to a specified width. There are 6 columns that I would like to be [100,150,150,100,100,'*'].
I'd appreciate any help other than see the PDFMake documentation.

My code:

<div class="container dataTables mt-3">

    <div id="customForm">
        <fieldset class="Contact Information">
            <div data-editor-template="names.first_name"></div>
            <div data-editor-template="names.last_name"></div>
            <div data-editor-template="names.phone"></div>
            <div data-editor-template="names.mobile"></div>
        </fieldset>
    </div>

    <h5>Territory: <span><?php echo $terrno; ?></span></h5>
    <table id="names" class="display compact" cellpadding="0" cellspacing="0" border="0" width="100%">
        <thead>
            <tr>
                <th></th>
                <th align="left">Name</th>
                <th align="left">Address</th>
                <th align="left">City</th>
                <th align="left">Phone</th>
                <th align="left">Mobile</th>
                <th align="left">Note</th>
            </tr>
        </thead>
    </table>

</div>

<script type="text/javascript">


var territory = "<?php echo $terrno; ?>";

(function($){

$(document).ready(function() {
    var editor = new $.fn.dataTable.Editor( {
        ajax: '../assets/dt/php/table.names.php',
        table: '#names',
        template: '#customForm',
        fields: [
            {
                "label": "First Name:",
                "name": "names.first_name",
                "attr": {placeholder: 'ie. John'}
            },
            {
                "label": "Last Name:",
                "name": "names.last_name",
                "attr": {placeholder: 'ie. Doe'}
            },
            {
                "label": "Address:",
                "name": "contacts.address"

            },
            {
                "label": "City:",
                "name": "postals.fullcity"
            },
            {
                "label": "Phone:",
                "name": "names.phone",
                "attr": {placeholder: 'ie. 123-456-7890'}
            },
            {
                "label": "Mobile:",
                "name": "names.mobile",
                "attr": {placeholder: 'ie. 123-456-7890'}
            },
            {
                "label": "Note:",
                "name": "names.note"
            }
        ]
    } );


    var table = $('#names').DataTable( {
        dom: 'Bfrtip',
        ajax: {
            url:    '../assets/dt/php/table.names.php',
            type:   'POST',
            data:   { 'territory': territory }
        },
        columns: [
            {
                data: null,
                defaultContent: '',
                className: 'select-checkbox',
                orderable: false
            },          
            { 
                'data': null, render: function ( data, type, row ) {
                return data.names.first_name+' '+data.names.last_name;
                }, 
                'className': 'editable' 
            },
            { "data": "contacts.address" },
            { "data": "postals.fullcity" },
            { "data": "names.phone", className: 'editable' },
            { "data": "names.mobile", className: 'editable' },
            { "data": "names.note" }
        ],
        select:         true,
        paging:         true,
        searching:      false,
        ordering:       false,
        lengthChange:   true,
        lengthMenu:     [15,20,25,30],
        pagingType:     "simple_numbers",
        buttons: [
            {
                extend: "edit",
                editor: editor,
                formButtons: [
                    'Update',
                    { text: 'Cancel', action: function () { this.close(); } }
                ]
            },
            {
                extend: 'pdfHtml5',
                header:  true,
                title: 'Territory: ' + territory,
                orientation: 'landscape',
                pageSize: 'LETTER',
                download: 'open',
                customize:  function (doc) { 
                    doc.layout = 'lightHorizotalLines;'
                    doc.pageMargins = [30, 30, 30, 30];
                    doc.defaultStyle.fontSize = 11;
                    doc.styles.tableHeader.fontSize = 12;
                    doc.styles.title.fontSize = 14;

                    // How do I set column widths to [100,150,150,100,100,'*']  ?

            }
        ]
    } );
} );

}(jQuery));

</script>

allan

This is the code we use to generate the PDF document description which is then passed on to PDFMake.

We don't explicitly set the column widths, rather letting pdfmake figure it out. But from their documentation it looks like you can add a widths property to the object for the table to specify the widths. You could do that in the customize callback in addition to your existing modifications.

Allan