Question

I’d like a “print” button on my web-site to print a document with Google Cloud Print, but I want the “url” of the target – a PDF file – to change dynamically, after the button has been clicked (notably, based on what’s returned from an AJAX call).

The GCP Web Element (GCPWE) seems to have similar functionality, but not quite what I desire. In particular, it seems as though one can only change the “target” (by calling setPrintDocument) before the button is clicked.

Is there a way to specify the URL for GCPWE after the button has been clicked?

Here’s the example code from the GCPWE site:

<div id="print_button_container"> </div>


<script src="http://www.google.com/cloudprint/client/cpgadget.js">
</script>
<script defer="defer">
    var gadget = new cloudprint.Gadget();
    gadget.setPrintButton(
          cloudprint.Gadget.createDefaultPrintButton("print_button_container"));
    gadget.setPrintDocument("url", "[document title]", "[document URL]");
</script>

I’ve considered hiding the <div id='print_button_container'> and triggering a .click event on it after a visible print button has been clicked, but this seems rather inelegant & improper. I’ve looked at the gpwidget.js linked to above, but the code has been minimized and is unintelligible (to me, at any rate).

What I seem to desire is a Javascript print function that you pass a [document URL] and [document title] to.

Is there a better way to achieve the desired functionality, rather than the ‘clicking the hidden button’ I’ve come up with?

Thank you for reading.

Answer 1

You can open print dialog whenever you want that, just call:

gadget.openPrintDialog()

and that will open printer dialog.
So for your case you might want to create print button using static method:

cloudprint.Gadget.createDefaultPrintButton("print_button_container");

then attach custom handlers for the button, and whenever you are ready just call:

var gadget = new cloudprint.Gadget();
gadget.setPrintDocument(...);
gadget.openPrintDialog();