Link Search Menu Expand Document

Generate PDF Quotation - C#

PDF from HTML Template sample in C# demonstrating ‘Generate PDF Quotation’

Program.cs
using System;
using System.Collections.Generic;
using System.IO;
using System.Net;
using Newtonsoft.Json;
using Newtonsoft.Json.Linq;

namespace ByteScoutWebApiExample
{
	class Program
	{
		// The authentication key (API Key).
		// Get your own by registering at https://app.pdf.co
		const String API_KEY = "******************";

		static void Main(string[] args)
		{
			// --TemplateID--
			/* 
				Please follow below steps to create your own HTML Template and get "templateId". 
				1. Add new html template in app.pdf.co/templates/html
				2. Copy paste your html template code into this new template. Sample HTML templates can be found at "https://github.com/bytescout/pdf-co-api-samples/tree/master/PDF%20from%20HTML%20template/TEMPLATES-SAMPLES"
				3. Save this new template
				4. Copy it’s ID to clipboard
				5. Now set ID of the template into “templateId” parameter
			*/

			// HTML template using built-in template
			// see https://app.pdf.co/templates/html/2/edit
			var templateId = 478; // Replace with your templateId

			// Data to fill the template
			string templateData = File.ReadAllText(@".\quote_data.json");
			// Destination PDF file name
			string destinationFile = @".\result.pdf";

			// Create standard .NET web client instance
			WebClient webClient = new WebClient();

			// Set API Key
			webClient.Headers.Add("x-api-key", API_KEY);

			webClient.Headers.Add("Content-Type", "application/json");

			try
			{
                // URL for `HTML to PDF` API call
				string url = Uri.EscapeUriString(string.Format(
					"https://api.pdf.co/v1/pdf/convert/from/html?name={0}", 
					Path.GetFileName(destinationFile)));

				// Prepare requests params as JSON
				Dictionary<string, object> parameters = new Dictionary<string, object>();
				parameters.Add("name", Path.GetFileName(destinationFile));
				parameters.Add("templateId", templateId);
				parameters.Add("templateData", templateData);

				// Convert dictionary of params to JSON
				string jsonPayload = JsonConvert.SerializeObject(parameters);

                // Execute request
				string response = webClient.UploadString(url, jsonPayload);

	            // Parse JSON response
	            JObject json = JObject.Parse(response);

	            if (json["error"].ToObject<bool>() == false)
	            {
		            // Get URL of generated PDF file
		            string resultFileUrl = json["url"].ToString();

		            webClient.Headers.Remove("Content-Type"); // remove the header required for only the previous request

		            // Download the PDF file
					webClient.DownloadFile(resultFileUrl, destinationFile);

					Console.WriteLine("Generated PDF document saved as \"{0}\" file.", destinationFile);
	            }
	            else
	            {
		            Console.WriteLine(json["message"].ToString());
	            }
            }
            catch (WebException e)
            {
	            Console.WriteLine(e.ToString());
            }

			webClient.Dispose();

            Console.WriteLine();
            Console.WriteLine("Press any key to exit...");
            Console.ReadKey();
		}
	}
}

quotation_template.html
<!-- this sample shows how to use {{macro}} styles variables but also how to define simple functions and conditional logic -->
<!-- Handlebars it the powerful template language based on {{Mustache}} but with conditions, js functions and much more. See https://handlebarsjs.com/ for information and samples -->
<!doctype html>
<html lang="en-US">
<head>

    <script>
        // you can use Handlebars helpers like #if, #unless, #each (see https://handlebarsjs.com/guide/builtin-helpers.html)
        // but you can also define your own helper functions like the one below which takes all items and calculates total price
        // see Handlebars custom helpers section: https://handlebarsjs.com/guide/#custom-helpers

        // also see Handlebars playground online: https://handlebarsjs.com/examples/helper-safestring.html

        // calculating total after discount with added tax
        Handlebars.registerHelper("calcTotal", calcTotal);

        function calcTotal(data) {
            // first calculate total
            var total = 0;
            for (var i in data.items) {
                total += data.items[i].price;
            }

            return new Handlebars.SafeString(
                numberFormat(
                    roundAdvanced(
                        (total - total * data.discount) * // applying discount
                        (1.00 + data.tax) // adding tax
                    )
                )
            );
        }

        // calculating tax alone
        Handlebars.registerHelper("calcTax", calcTax);

        function calcTax(data) {
            // first calculat total
            var total = 0;
            for (var i in data.items) {
                total += data.items[i].price;
            }

            return new Handlebars.SafeString(
                numberFormat(
                    roundAdvanced(
                        total * (1.00 - data.discount) * // total with discount applied
                        data.tax
                    )
                )
            ); // calculating tax alone
        }

        // calculating discount alone (discount is always before tax)
        Handlebars.registerHelper("calcDiscount", calcDiscount);

        function calcDiscount(data) {
            // first calculate total
            var total = 0;
            for (var i in data.items) {
                total += data.items[i].price;
            }

            return new Handlebars.SafeString(
                numberFormat(
                    roundAdvanced(
                        total * data.discount
                    )
                )
            );
        }

        Handlebars.registerHelper('numberFormat', numberFormat);

        function numberFormat(value) {
            // Helper parameters
            var dl = 2;
            var ts = ',';
            var ds = '.';

            // Parse to float
            var value = parseFloat(value);

            // The regex
            var re = '\\d(?=(\\d{3})+' + (dl > 0 ? '\\D' : '$') + ')';

            // Formats the number with the decimals
            var num = value.toFixed(Math.max(0, ~~dl));

            // Returns the formatted number
            return (ds ? num.replace('.', ds) : num).replace(new RegExp(re, 'g'), '$&' + ts);
        }

        function roundAdvanced(val) {
            // round to 2 decimal places https://stackoverflow.com/a/11832950
            return Math.round(val * 100 + Number.EPSILON) / 100;
        }

        // multiple number and return
        Handlebars.registerHelper('multiply', function (value1, value2) {
            return roundAdvanced(value1 * value2);
        });

    </script>

    <title>Quotation {{quote_no}} {{client_name}}</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">
</head>
<body>
    <div class="container">
        <div class="">
            <div class="">

                <!-- Quotation: header begin-->
                <div class="row col-md-12">
                    <div class="col col-md-6">
                        <div class="font-weight-bold">{{issuer_name}}</div>

                        <div class="">{{issuer_company}}</div>
                        <div class="">{{issuer_address}}</div>
                        <div class="">{{issuer_email}}</div>
                        <div class="">{{issuer_website}}</div>
                    </div>
                    <div class="col col-md-6">
                        <div class="">
                            <div class="">
                                <span class="font-weight-bold">Quotation Number:</span> {{quote_no}}
                            </div>
                            <div class="">
                                <span class="font-weight-bold">Date:</span> {{quotation_date}}
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row col-md-12">
                    <div class="col col-md-6"></div>

                    <div class="col col-md-6">
                        <div class="font-weight-bold footer-title">TO</div>
                        <div class="">
                            <div class=""><strong>Name:</strong> {{client_name}}</div>
                            <div class=""><strong>Company:</strong> {{client_company}}</div>
                            <div class=""><strong>Address:</strong> {{client_address}}</div>
                            <div class=""><strong>Email:</strong> {{client_email}}</div>
                        </div>
                    </div>
                </div>

                <div class="row col-md-12">
                    <div class="col col-md-12">
                        <p>
                            Dear <strong>{{client_name}}</strong>
                        </p>
                        <p>
                            Thank you for your interest in our company and opportunity to quote. We are pleased to quote as follows:
                        </p>
                    </div>
                </div>

                <div class="row col-md-12">
                    <div class="col col-md-12">
                        <table class="table table-striped" cellspacing="0">
                            <thead>
                                <tr class="table-head">
                                    <th class="text-left">Item</th>
                                    <th class="text-right">Price</th>
                                </tr>
                            </thead>
                            <tbody>
                                {{#each items}}
                                <tr>
                                    <td class="text-left">{{name}}</td>
                                    <td class="text-right">${{numberFormat price}}</td>
                                </tr>
                                {{/each}}
                            </tbody>
                        </table>
                    </div>

                </div>
                <div class="row col-md-12">
                    <div class="col col-md-6">
                    </div>
                    <div class="col col-md-6 text-right">
                        <div style="margin-bottom: 10px;">Discount:   <span class="amount">${{calcDiscount @root}}</span></div>
                        <div style="margin-bottom: 10px;">Tax:   <span class="amount">${{calcTax @root}} ({{multiply @root.tax 100}}%)</span></div>
                        <div class="font-weight-bold footer-title alert-warning">TOTAL: <span class="total-amount amount font-weight-bold">${{calcTotal @root}}</span></div>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <div class="container mt-5">
        <div class="row col-md-12">
            <div class="col col-md-12 text-muted">
                <p>All prices quoted are valid for 30 days from the date of stated on the quotation. Where you are unsure about any of the information supplied in this quotation, please contact to discuss further as the company will work with you to explain any element you are unsure of. If you require a reasonable breakdown of your quotation please contact the company and we will try where possible to clarify the costs quoted. </p>
            </div>
            <div class="col col-md-12 mt-3">
                <strong>Please sign and return a copy of the quotation to issue your order.</strong>
            </div>
            <div class="col col-md-12 mt-5">
                ________________________________
            </div>

        </div>
    </div>

    <center>
        <img src="[[barcode: QRCode Quotation {{quote_no}} {{client_name}} ]]" />
    </center>

    <div class="text-right">
        <strong>
            <em>
                Thank you for your business
            </em>
        </strong>
    </div>
</body>
</html>
quote_data.json
{
  "quote_no": "1234567",
  "quotation_date": "April 30, 2016",
  "issuer_name": "Acme Inc",
  "issuer_company": "Acme International",
  "issuer_address": "City, Street 3rd",
  "issuer_email": "support@example.com",
  "issuer_website": "http://example.com",
  "client_name": "Food Delivery Inc.",
  "client_company": "Food Delivery International",
  "client_address": "New York, Some Street, 42",
  "client_email": "client@example.com",
  "items": [
    {
      "name": "Setting up new web-site",
      "price": 250
    },
    {
      "name": "Website Content Addition",
      "price": 700
    },
    {
      "name": "Database Setup",
      "price": 200
    },
    {
      "name": "Record Digitalization",
      "price": 1800
    }
  ],
  "tax": 0.065,
  "discount": 0.01
}

PDF.co Web API: the Web API with a set of tools for documents manipulation, data conversion, data extraction, splitting and merging of documents. Includes image recognition, built-in OCR, barcode generation and barcode decoders to decode bar codes from scans, pictures and pdf.

Get your PDF.co API key here!

Download Source Code (.zip)

return to the previous page explore PDF from HTML Template endpoint