ScriptX logotype
  • Getting started
  • Documentation
  • Samples
  • Pricing
Free Trial Downloads
  • Home
  • Getting started
  • Documentation
  • Samples
  • Pricing
Developers ›  Knowledge Bank ›  How To Guides ›  ScriptX.Services ›  Then To Now ›  Stage 1

Implement an in document UI

This walk-through illustrates taking a classic document that has a controlled print experience and works only in Internet Explorer and making it work with ScriptX.Services in any browser on any platform using the minimum amount of development effort and making as few changes as possible (though more changes might be desirable).

Previously : Introduction - the for IE only original

ScriptX.Services cannot intercept the browser UI so we first create a simple UI within the document. This will work with both ScriptX.Add-on and ScriptX.Services.

We will use jQuery to wire up the UI - jQuery is not required by the libraries.

	
    <!-- new UI -->
    <div>
    <button id="btn-print">Print</button> <button id="btn-preview">Preview</button>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js"></script>
	
	
	<!-- leave current script as is, it will work .. to minimise effort -->
	<script>
	function initView() {
	  // WARNING: use of .enhancedFormatting requires a license with Enhanced Formatting enabled.
	  factory.printing.enhancedFormatting.allPagesHeader = 
		"<div><center><img src='http://services.meadroid.com/images/sx-header.png'></center></div>";
	  factory.printing.enhancedFormatting.allPagesFooter = 
		"<div><center><img src='http://services.meadroid.com/images/sx-footer-final.png'></center></div>";
	  // Remove the above two lines if testing with a license without Enhanced Formatting enabled.
	  factory.printing.SetMarginMeasure(2); // set inches
	  factory.printing.header = "";
	  factory.printing.footer = "";
	  factory.printing.leftMargin = 1.0;
	  factory.printing.topMargin = 1.5;
	  factory.printing.rightMargin = 1.0;
	  factory.printing.bottomMargin = 1.5;
	}
	</script>

	<!-- new UI script -->
	<script type="text/javascript">
	$(window).on("load",function() {

	  viewInit();
		$("#btn-print").click(function() { 
			factory.printing.Print();
		});
	
		$("#btn-preview").click(function() { 
			factory.printing.Preview();
		});
	});
	</script>

As can be seen, we have retained the old viewInit() function. However as we use typical jQuery code for initialising event handlers for the UI buttons we have moved the call to viewInit() from the body tag to the jQuery "onload" event handler.

Browse to the sample

Open your browser (Internet Explorer) and go to the address  https://scriptxprintsamples.meadroid.com/ThenToNow/ThenUI

The buttons can be used to print and/or preview the page as well as using the options from the browser Print menu.

Next up: Stage 2 - Add ScriptX.Services scripts
  • Knowledge Bank
  • 'How To' Guides
    • ScriptX.Services
      • Introduction
      • Getting started
      • Evaluate with modern code
      • Maintaining investment in current code
        • Stage 1: Adding UI
        • Stage 2: Printing with ScriptX.Services
        • Stage 3: Summary and review
        • Stage 4: Error reporting
        • Stage 5: Prompted printing
        • Stage 6: Preparing for advanced uses
        • Stage 7: WaitForSpoolingComplete
        • Stage 8: Recommendations for some common issues
      • Printing with the API
      • MeadCoScriptXJS Library
      • Installing ScriptX.Services
        • For Windows PC
        • For On Premise Devices hosted on Windows Server
        • For On Premise Devices hosted on Windows 10/11
        • Configure options For On Premise Devices
        • Cloud
      • Orchestrator
      • Debugging
      • License deployment
        • For Windows PC
        • For On Premise Devices
      • Samples
        • Configure for Windows PC
        • Configure for On Premise
        • Configure for Cloud
    • Security Manager
      • Deploying a license or revision
    • ScriptX.Add-on
      • Introduction
      • Installing ScriptX on client PCs
      • Basic printing with ScriptX
      • Advanced printing features
      • Backwards compatibility
      • How to check if ScriptX is installed
      • License deployment
      • Quick start with Visual Studio
        • ASP.NET MVC
        • ASP.NET Web Forms
      • Nuget Packages
        • MeadCoScriptXJS Library
        • Installer helpers
        • ASP.NET WebForms Controls
        • Helpers for ASP.NET MVC
      • Client-side printing samples
  • Technical Reference
    • ScriptX.Services
      • Web service API
        • Service Description
          • (GET)
        • Licensing
          • licensing (GET)
          • licensing (POST)
          • licensing/ping (GET)
        • Printer
          • settings (GET)
          • current (GET)
          • current (PUT)
          • connection (PUT)
          • connection (DELETE)
        • PrintHtml
          • settings (GET)
          • deviceinfo (GET)
          • htmlPrintDefaults (GET)
          • print (POST)
          • status (GET)
          • download (GET)
          • canceljob (PUT)
        • PrintPdf
          • print (POST)
          • status (GET)
          • download (GET)
        • PrintDirect
          • print (POST)
      • Orchestrator API
        • v1
          • GET
        • v2
          • PUT
          • GET
      • ScriptX.Services compatibility roadmap
    • Security Manager
      • How it works
      • License Expiry
      • Testing for a valid license
      • About the license file (.mlf)
        • LICENSE
        • APPLICENSE
        • TITLE
        • DOMAINS
        • DOMAIN
        • PERMISSION
      • API
        • Apply
        • License
        • result
        • validLicense
    • ScriptX.Add-on
      • factory
        • baseUrl
        • ComponentVersionString
        • IsUniqueIDAvailable
        • OnDocumentComplete
        • relativeUrl
        • ResetUniqueID
        • ScriptXVersion
        • SecurityManagerVersion
        • Shutdown
        • UniqueID
      • printing
        • AddPrinterConnection
        • BatchPrintPDF
        • BatchPrintPDFEx
        • bottomMargin
        • collate
        • copies
        • currentPrinter
        • DefaultPrinter
        • disableUI
        • duplex
        • duplex2
        • EnumJobs
        • EnumPrinters
        • footer
        • GetJobsCount
        • GetMarginMeasure
        • header
        • headerFooterFont
        • IsSpooling
        • IsTemplateSupported
        • leftMargin
        • onafterprint
        • onbeforeprint
        • onbeforeunload
        • onpagesetup
        • onuserpagesetup
        • onuserprint
        • onuserprintpreview
        • orientation
        • OwnQueue
        • pageHeight
        • PageSetup
        • pageWidth
        • paperSize
        • paperSource
        • paperSource2
        • portrait
        • Preview
        • Print
        • printBackground
        • printer
        • PrintHTML
        • PrintHTMLEx
        • PrintPDF
        • PrintSetup
        • printToFileName
        • RemovePrinterConnection
        • rightMargin
        • SetMarginMeasure
        • SetPageRange
        • SetPreviewZoom
        • SetPrintScale
        • Sleep
        • templateURL
        • topMargin
        • TotalPrintPages
        • unprintableBottom
        • unprintableLeft
        • unprintableRight
        • unprintableTop
        • WaitForSpoolingComplete
      • printerControl
        • attributes
        • Bins
        • Forms
        • isLocal
        • isNetwork
        • isShared
        • Jobs
        • location
        • name
        • Pause
        • port
        • Purge
        • Resume
        • serverName
        • shareName
        • status
      • Job
        • Delete
        • Pause
        • Restart
        • Resume
      • enhancedFormatting
        • allFooterHeight
        • allHeaderHeight
        • allPagesFooter
        • allPagesHeader
        • extraFirstFooterHeight
        • extraFirstPageFooter
        • firstFooterHeight
        • firstHeaderHeight
        • firstPageFooter
        • firstPageHeader
        • pageRange
        • printingPass
      • rawPrinting
        • printer
        • printDocument
        • printString
    • Change and history logs
    • Articles
      • v1.15.x ScriptX Client Library
      • Dialogs with ScriptX.Services
      • Accessing protected content
      • Long term servicing (LTS)
 
ScriptX logotype
Home Getting started Documentation Samples Contact us

© 2025 Mead & Co Limited.

Follow us:
LinkedIn   GitHub
X

Warning:

This ScriptX.Add-on sample can only be viewed using Internet Explorer.