	function loadData() {
	    var oTable = $('#shipping-order').DataTable({
	        "serverSide": true,
	        "ajax": {
	            "url": "/shipping-order/list",
	            "type": "POST",
	        },
	        "columnDefs": [{
	                className: "dt-body-center",
	                "targets": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
	            },

	        ],
	        "language": {
	            "aria": {
	                "sortAscending": ": activate to sort column ascending",
	                "sortDescending": ": activate to sort column descending"
	            },
	            "emptyTable": "No data available in table",
	            "info": "Showing _START_ to _END_ of _TOTAL_ entries",
	            "infoEmpty": "No entries found",
	            "infoFiltered": "(filtered1 from _MAX_ total entries)",
	            "lengthMenu": "_MENU_ entries",
	            "search": "Search:",
	            "zeroRecords": "No matching records found"
	        },
	        buttons: [{
	                extend: 'print',
	                className: 'btn dark btn-outline'
	            },
	            {
	                extend: 'excel',
	                className: 'btn yellow btn-outline '
	            },
	            {
	                extend: 'colvis',
	                className: 'btn dark btn-outline',
	                text: 'Columns'
	            }
	        ],
	        "lengthMenu": [
	            [10, 25, 50, 100, 99999999],
	            [10, 25, 50, 100, "All"]
	        ],
	        "order": [
	            [0, 'asc']
	        ],

	    });

	    var tableWrapper = jQuery('#shipping-order_wrapper');
	    $('.search-input-text').on('keyup click change', function() { // for text boxes
	        var i = $(this).attr('data-column'); // getting column index
	        var v = $(this).val(); // getting search input value
	        oTable.columns(i).search(v).draw();
	    });
	    $('.search-input-select').on('change', function() { // for select box
	        var i = $(this).attr('data-column');
	        var v = $(this).val();
	        oTable.columns(i).search(v).draw();
	    });
	    $('.filter-cancel').on('click', function() { // for select box
	        $('.search-input-text').val('');
	        $('.search-input-select').val('');
	        $('.search-input-text').trigger('change');
	        $('.search-input-select').trigger('change');

	        oTable.draw();
	    });
	    $("#shipping-order_filter").css("display", "none");
	    $('#sample_3_tools > li > a.tool-action').on('click', function() {
	        var action = $(this).attr('data-action');
	        oTable.DataTable().button(action).trigger();
	    });


	}
	$(document).ready(function() {
	    loadData(1);

	    $(document).on("click", ".previewPL", function() {
	        var id = $(this).data('id');
	        var dataStringg = 'id=' + id;
	        $.ajax({
	            type: "POST",
	            url: "/shipping-order/get-packing-list",
	            cache: false,
	            data: dataStringg,
	            success: function(data) {
	                $("#getCode").html(data);
	                jQuery("#previewPL").modal('show');
	            }
	        });
	    });
	    $(document).on("click", ".previewMarking", function() {
	        var id = $(this).data('id');
	        var dataStringg = 'id=' + id;
	        $.ajax({
	            type: "POST",
	            url: "/shipping-order/get-marking",
	            cache: false,
	            data: dataStringg,
	            success: function(data) {
					alert();
	                $("#getCode2").html(data);
					setTimeout(function() {
						html2canvas(document.querySelector("#SOmarking"), {
						allowTaint: false,
						useCORS: true,
						
						}).then(function(canvas) {
							canvas.id = "h2canvas";
							$("#img-out").append(canvas);
							$("#SOmarking").hide();
						});


					}, 500);
						
					
	                jQuery("#previewMarking").modal('show');
	            }
	        });
	    });
	});
	$().ready(function() {
	    $('.modal.printable1').on('shown.bs.modal', function() {
	        $('.modal-dialog', this).addClass('focused');
	        $('body').addClass('modalprinter');

	        if ($(this).hasClass('autoprint')) {
	            window.print();
	        }
	    }).on('hidden.bs.modal', function() {
	        $('.modal-dialog', this).removeClass('focused');
	        $('body').removeClass('modalprinter');
	    });
	    $('.modal.printable2').on('shown.bs.modal', function() {
	        $('.modal-dialog', this).addClass('focused');
	        $('body').addClass('modalprinter');

	        if ($(this).hasClass('autoprint')) {
	            window.print();
	        }
	    }).on('hidden.bs.modal', function() {
	        $('.modal-dialog', this).removeClass('focused');
	        $('body').removeClass('modalprinter');
	    });
	    $('#pdf').click(function() {

	        var pdf = new jsPDF('l', 'pt', 'a4');
	        // source can be HTML-formatted string, or a reference
	        // to an actual DOM element from which the text will be scraped.
	        source = $('#packinglists')[0];

	        // we support special element handlers. Register them with jQuery-style 
	        // ID selector for either ID or node name. ("#iAmID", "div", "span" etc.)
	        // There is no support for any other type of selectors 
	        // (class, of compound) at this time.
	        specialElementHandlers = {
	            // element with id of "bypass" - jQuery style selector
	            '#bypassme': function(element, renderer) {
	                // true = "handled elsewhere, bypass text extraction"
	                return true
	            }
	        };

	        margins = {
	            top: 20,
	            bottom: 60,
	            left: 40,
	            width: 2000
	        };
	        // all coords and widths are in jsPDF instance's declared units
	        // 'inches' in this case
	        pdf.fromHTML(
	            source, // HTML string or DOM elem ref.
	            margins.left, // x coord
	            margins.top, { // y coord
	                'width': margins.width, // max width of content on PDF
	                'elementHandlers': specialElementHandlers
	            },
	            function(dispose) {
	                // dispose: object with X, Y of the last line add to the PDF 
	                //          this allow the insertion of new lines after html
	                pdf.save('Packing_List.pdf');
	            }, margins);
	    });
	    $('#pdf2').click(function() {

	        
	        // source can be HTML-formatted string, or a reference
	        // to an actual DOM element from which the text will be scraped.
			canvas = document.getElementById("h2canvas");

			var imgData = canvas.toDataURL('image/png'); 
			var pdf = new jsPDF('l', 'pt', 'a4'); 
			pdf.text(30, 30, 'Marking');
			pdf.addImage(imgData, 'PNG', 80, 80);
			pdf.save('download.pdf');
	    });

	    $('#excel').click(function() {
	        var htmls = "";
	        var uri = 'data:application/vnd.ms-excel;base64,';
	        var template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>';
	        var base64 = function(s) {
	            return window.btoa(unescape(encodeURIComponent(s)))
	        };

	        var format = function(s, c) {
	            return s.replace(/{(\w+)}/g, function(m, p) {
	                return c[p];
	            })
	        };

	        htmls = $('#packinglists').html()

	        var ctx = {
	            worksheet: 'Worksheet',
	            table: htmls
	        }


	        var link = document.createElement("a");
	        link.download = "Packing_List.xls";
	        link.href = uri + base64(format(template, ctx));
	        link.click();
	    });
	});