<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<script src="http://parall.ax/parallax/js/jspdf.js"></script>
<script>
var doc = new jsPDF();
// We'll make our own renderer to skip this editor
var specialElementHandlers = {
'#editor': function(element, renderer){
return true;
}
};
// All units are in the set measurement for the document
// This can be changed to "pt" (points), "mm" (Default), "cm", "in"
doc.fromHTML($('#render_me').get(0), 15, 15, {
'width': 170,
'elementHandlers': specialElementHandlers
});
//doc.save('Test.pdf');
$('a').click(function(){
doc.save('TestHTMLDoc.pdf');
});
</script>
<a href="#">Download Test PDF</a>
<div id="render_me">
<div class="col col50 float_left"><h4> </h4><strong>Order Placed</strong>: 11/22/13, 10:38 am<h4>Customer Information</h4><p><a href="/surplus_ammo/admin/user/index.php?action=edit&id=2">Scott Dunham</a><br><a href="mailto:sdunham@sitecrafting.com">sdunham@sitecrafting.com</a><br>123.456.7890</p></div><div class="col col50 float_right no_margin"><h4>Status</h4><select name="OrderStatusId" id="order_edit_OrderStatusId"><option value="1" selected="selected">New</option><option value="2">Processed</option><option value="3">Shipped</option><option value="4">Completed</option></select><h4>Invoice Number</h4>
<input class="field" type="text" id="order_edit_InvoiceNumber" name="InvoiceNumber" value="12345"></div><div class="col100 float_left no_margin"><div class="cleaner"></div></div><div class="col col50 float_left"><h4>Expected Shipping Date</h4>
<input type="text" id="order_edit_ExpectedShipDate" class="field dates hasDatepicker" name="ExpectedShipDate" value=""></div><div class="col col50 float_right no_margin"><h4>Shipping Tracking Code</h4>
<input class="field" type="text" id="order_edit_ShippingTrackingCode" name="ShippingTrackingCode" value=""></div><div class="col100 float_left no_margin"><div class="cleaner"></div></div><div class="col col50 float_left"><h4>Billing Information</h4><p>Sean Dean<br>Sitecrafting<br>1234 S Street St<br>Apt # 1<br>Tacoma, WA 98408</p></div><div class="col col50 float_right no_margin"><h4>Shipping Information</h4><p>Sean Dean<br>SiteCrafting<br>1234 S Street St<br>Apt # 1<br>Tacoma, WA 98408</p><p><strong>Delivery Confirmation</strong>: Blah blah blah, confirmation</p><p><strong>Order Notes</strong><br>Here are some notes for the order</p><p><strong>Special Instructions</strong><br>Here are some special instructions for shipping to me.</p></div><div class="col100 float_left no_margin"><div class="cleaner"></div></div><div class="col col50 float_left"></div><div class="col col50 float_right no_margin"></div><div class="col col100 float_left no_margin"><h3 style="padding-top: 20px;">FFL Information</h3></div><div class="col col50 float_left"></div><div class="col col50 float_right no_margin"></div><div class="col col100 float_left no_margin"><h4>Customer Indicated FFL is on file</h4>No</div><div class="col col50 float_left"><h4>Gun Dealer Business Name</h4>
<input class="field" type="text" id="order_edit_FFLBusinessName" name="FFLBusinessName" value=""><h4>Gun Dealer Address 1</h4>
<input class="field" type="text" id="order_edit_FFLAddress1" name="FFLAddress1" value=""><h4>Gun Dealer City</h4>
<input class="field" type="text" id="order_edit_FFLCity" name="FFLCity" value=""><h4>Gun Dealer Zipcode</h4>
<input class="field" type="text" id="order_edit_FFLZipcode" name="FFLZipcode" value=""></div><div class="col col50 float_right no_margin"><h4>Gun Dealer Phone</h4>
<input class="field" type="text" id="order_edit_FFLPhone" name="FFLPhone" value=""><h4>Gun Dealer Address 2</h4>
<input class="field" type="text" id="order_edit_FFLAddress2" name="FFLAddress2" value=""><h4>Gun Dealer State</h4>
<input class="field" type="text" id="order_edit_FFLState" name="FFLState" value=""></div><div class="col col100 float_left no_margin"><h4>Products Ordered</h4><table id="order-table" style="width: 97%;">
<thead>
<tr>
<th>
Qty
</th>
<th style="width: 200px;">
Item
</th>
<th>
Restriction(s)
</th>
<th class="align-right">
Cost Each
</th>
<th class="align-right">
Total
</th>
</tr>
</thead><tbody><tr>
<td>10</td>
<td>I'm just testing this</td>
<td><ul><li>FFL</li><li>Shipping</li></ul></td>
<td class="align-right">$10</td>
<td class="align-right">$100</td>
</tr><tr>
<td>3</td>
<td>Another test, don't care what the name is</td>
<td><ul><li>FFL</li><li>Shipping</li></ul></td>
<td class="align-right">$20.5</td>
<td class="align-right">$61.5</td>
</tr><tr class="lower">
<td colspan="4" class="align-right">Shipping</td>
<td class="align-right">$10.25</td>
</tr><tr class="lower">
<td colspan="4" class="align-right">Tax</td>
<td class="align-right">$1.25</td>
</tr><tr class="lower">
<td colspan="4" class="align-right"><h4>Total</h4></td>
<td class="align-right"><h4>$173</h4></td>
</tr></tbody></table></div><div class="col col50 float_left"></div><div class="col col50 float_right no_margin"></div><div class="cleaner">
</div>
<script src='http://parall.ax/parallax/js/jspdf.js'></script>
$(document).ready(function () {
var doc = new jsPDF();
// We'll make our own renderer to skip this editor
var specialElementHandlers = {
'#editor': function(element, renderer){
return true;
}
};
// All units are in the set measurement for the document
// This can be changed to "pt" (points), "mm" (Default), "cm", "in"
doc.fromHTML($('#render_me').get(0), 15, 15, {
'width': 170,
'elementHandlers': specialElementHandlers
});
//doc.save('Test.pdf');
}); // end document.ready function
$('a').click(function(){
doc.save('TestHTMLDoc.pdf');
});