Basic Use :: Print and Preview

When using a printing utility the obviously fundamental feature is starting a print or preview of the content to be printed.

The basic set of features of ScriptX include the print or preview of the current document or any of its frames.

To print, we require the ScriptX factory object ([PATH_TO_INSTALLER] is the location of the smsx.cab file on your server):

<object codebase="[PATH_TO_INSTALLER]#Version=8,3,0,4" classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" id="factory">
</object>

The user might use the gear menu or right client menu to print but it is more helpful to include the UI on the page:

<div class="panel hidden-print panel-default">
    <div class="panel-heading">CSS styling will hide this UI from the print ...</div>
    <div class="panel-body">
        <button type="button" class="btn btn-default btn-print" id="btn-print">Print ...</button>
        <button type="button" class="btn btn-default btn-print" id="btn-preview">Preview ...</button>
    </div>
</div>

We include a helper library that will hide browser and version differences and wraps some common tasks in easy to use functions. The library can be found on Nuget and Github.

<script src="/Scripts/meadco-scriptx-1.10.1.js"></script>

And finally we glue everything together with simple script using jQuery:

<script type="text/javascript">
// SetupPrint
// Initialise print attributes, will be reset when the document closes.
function SetupPrint() {
    with (MeadCo.ScriptX.Printing) {
        header = "Print and Preview";
        footer = "&D&b&b&p of &P";
        orientation = "landscape";
    }
}
$(window).on('load', function() {
    if (MeadCo.ScriptX.Init()) {
        SetupPrint();
        $("#btn-print").click(function() {
            MeadCo.ScriptX.PrintPage(true);
        });
        $("#btn-preview").click(function () {
            MeadCo.ScriptX.PreviewPage(true);
        });
    } else {
        $(".btn-print").prop("disabled", true);
    }
});
</script>