Calculator Tools Calculator Tools
Create

DTF Print & Press - Customer Supplied Goods & Art - (V26.1)

Aug 10, 2025

About this app

DTF Print & Press Application for customer supplied goods and art, providing a streamlined interface for order management.

DTF Print & Press - Customer Supplied Goods & Art - (V26.1) DTF Print & Press - Customer Supplied Goods & Art - (V26.1) Powered by SeaSide Silk Screening Name/PO Number: Quantity: Qty Price Breaks 24, 36, 48, 72, 144, 288 Product Type: Select Product Type T-Shirt ($0) Polo ($1) Fleece ($2) Cap ($3) Print Location 1: N/A ($0) Left Front Chest ($1) Right Front Chest ($1) Full Front ($2) Full Back ($2) Print Location 2: N/A ($0) Left Front Chest ($1) Right Front Chest ($1) Full Front ($2) Full Back ($2) Print Location 3: N/A ($0) Left Front Chest ($1) Right Front Chest ($1) Full Front ($2) Full Back ($2) Print Location 4: N/A ($0) Left Front Chest ($1) Right Front Chest ($1) Full Front ($2) Full Back ($2) Turn Time: Select Turn Time Standard Turn Time As Posted ($1) 1 Business Day < 10% ($1.1) 2 Business Days < 20% ($1.2) 3 Business Days < 30% ($1.3) 4 Business Days < 40% ($1.4) 5 Business Days < 50% ($1.5) 6 Business Days < 60% ($1.6) 7 Business Days < 70% ($1.7) 8 Business Days < 80% ($1.8) 9 Business Days < 90% ($1.9) Payment Type: Unselected ($0) Credit Card ($1.036) ACH (No Fees) ($1) Unit Total: Order Total: Reset Submit Order via Email

Related apps

Put this on your site

Source

                    <html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">

<title>DTF Print & Press - Customer Supplied Goods & Art - (V26.1)</title>
<meta name="description" content="DTF Print & Press Application for customer supplied goods and art, providing a streamlined interface for order management.">
<meta name="keywords" content="DTF Print, Apparel Printing, Custom Orders, Silk Screening">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.6.0/css/fontawesome.min.css" crossorigin="anonymous">

<script type="text/javascript">
try {
document.addEventListener("DOMContentLoaded", function() {
const prices = {
productTypes: {
"T-Shirt": 0,
"Polo": 1,
"Fleece": 2,
"Cap": 3
},
printLocations: {
"N/A": 0,
"Left Front Chest": 1,
"Right Front Chest": 1,
"Full Front": 2,
"Full Back": 2
},
turnTimes: {
"Standard Turn Time As Posted": 1,
"1 Business Day": 1.1,
"2 Business Days": 1.2,
"3 Business Days": 1.3,
"4 Business Days": 1.4,
"5 Business Days": 1.5,
"6 Business Days": 1.6,
"7 Business Days": 1.7,
"8 Business Days": 1.8,
"9 Business Days": 1.9
},
paymentTypes: {
"Unselected": 0,
"Credit Card": 1.036,
"ACH (No Fees)": 1
},
};

function calculateTotals() {
const qty = parseInt($('#quantity').val()) || 0;
const productType = prices.productTypes[$('#productType').val()] || 0;
const printLocation1 = prices.printLocations[$('#printLocation1').val()] || 0;

let QDiscount = (qty <= 23) ? 1 : ((qty == 24) ? 0.5 : 0);
let RCU = 0.16;
let UT = (productType + RCU) * QDiscount;
let OT = UT * qty;

$("#unitTotal").val(UT.toFixed(2));
$("#orderTotal").val(OT.toFixed(2));
}

$('#quantity, #productType, #printLocation1').on('change', calculateTotals);
$('#resetBtn').on('click', function() {
$('#orderForm')[0].reset();
calculateTotals();
});

calculateTotals(); // Initial Calculation
});

} catch (error) {
throw error;
}
</script>

<style>
body {
background-color: white;
color: black;
}
.bordered {
border: 2px solid blue;
padding: 15px;
margin: 15px 0;
}
.btn-email {
background-color: #007bff;
color: white;
}
.btn-email:hover {
background-color: #0056b3;
}
</style>
</head>
<body>
<div id="main-container" class="container">
<h1>DTF Print & Press - Customer Supplied Goods & Art - (V26.1)</h1>
<small>Powered by SeaSide Silk Screening</small>

<form id="orderForm">
<div class="form-group bordered">
<label for="namePO">Name/PO Number:</label>
<input type="text" class="form-control" id="namePO" required>

<div class="row mt-2">
<div class="col">
<label for="quantity">Quantity:</label>
<input type="number" class="form-control" id="quantity" min="0" required>
<small>Qty Price Breaks 24, 36, 48, 72, 144, 288</small>
</div>

<div class="col">
<label for="productType">Product Type:</label>
<select class="form-control" id="productType" required>
<option value="">Select Product Type</option>
<option value="T-Shirt">T-Shirt ($0)</option>
<option value="Polo">Polo ($1)</option>
<option value="Fleece">Fleece ($2)</option>
<option value="Cap">Cap ($3)</option>
</select>
</div>
</div>
</div>

<div class="row bordered">
<div class="col">
<label for="printLocation1">Print Location 1:</label>
<select class="form-control" id="printLocation1">
<option value="N/A">N/A ($0)</option>
<option value="Left Front Chest">Left Front Chest ($1)</option>
<option value="Right Front Chest">Right Front Chest ($1)</option>
<option value="Full Front">Full Front ($2)</option>
<option value="Full Back">Full Back ($2)</option>
</select>
</div>

<!-- Add dropdowns for Print Location 2, 3, and 4 in a similar manner -->
<div class="col">
<label>Print Location 2:</label>
<select class="form-control" id="printLocation2">
<option value="N/A">N/A ($0)</option>
<option value="Left Front Chest">Left Front Chest ($1)</option>
<option value="Right Front Chest">Right Front Chest ($1)</option>
<option value="Full Front">Full Front ($2)</option>
<option value="Full Back">Full Back ($2)</option>
</select>
</div>

<div class="col">
<label>Print Location 3:</label>
<select class="form-control" id="printLocation3">
<option value="N/A">N/A ($0)</option>
<option value="Left Front Chest">Left Front Chest ($1)</option>
<option value="Right Front Chest">Right Front Chest ($1)</option>
<option value="Full Front">Full Front ($2)</option>
<option value="Full Back">Full Back ($2)</option>
</select>
</div>

<div class="col">
<label>Print Location 4:</label>
<select class="form-control" id="printLocation4">
<option value="N/A">N/A ($0)</option>
<option value="Left Front Chest">Left Front Chest ($1)</option>
<option value="Right Front Chest">Right Front Chest ($1)</option>
<option value="Full Front">Full Front ($2)</option>
<option value="Full Back">Full Back ($2)</option>
</select>
</div>
</div>

<div class="row bordered">
<div class="col">
<label for="turnTime">Turn Time:</label>
<select class="form-control" id="turnTime">
<option value="">Select Turn Time</option>
<option value="Standard Turn Time As Posted">Standard Turn Time As Posted ($1)</option>
<option value="1 Business Day">1 Business Day < 10% ($1.1)</option>
<option value="2 Business Days">2 Business Days < 20% ($1.2)</option>
<option value="3 Business Days">3 Business Days < 30% ($1.3)</option>
<option value="4 Business Days">4 Business Days < 40% ($1.4)</option>
<option value="5 Business Days">5 Business Days < 50% ($1.5)</option>
<option value="6 Business Days">6 Business Days < 60% ($1.6)</option>
<option value="7 Business Days">7 Business Days < 70% ($1.7)</option>
<option value="8 Business Days">8 Business Days < 80% ($1.8)</option>
<option value="9 Business Days">9 Business Days < 90% ($1.9)</option>
</select>
</div>

<div class="col">
<label for="paymentType">Payment Type:</label>
<select class="form-control" id="paymentType">
<option value="Unselected">Unselected ($0)</option>
<option value="Credit Card">Credit Card ($1.036)</option>
<option value="ACH (No Fees)">ACH (No Fees) ($1)</option>
</select>
</div>
</div>

<div class="row">
<div class="col">
<label>Unit Total:</label>
<input type="text" id="unitTotal" class="form-control" readonly>
</div>

<div class="col">
<label>Order Total:</label>
<input type="text" id="orderTotal" class="form-control" readonly>
</div>

<div class="col">
<button id="resetBtn" class="btn btn-danger" type="button">Reset</button>
</div>
</div>

<button class="btn btn-email mt-2" type="submit">Submit Order via Email</button>
</form>
</div>
</body>
</html>