> For the complete documentation index, see [llms.txt](https://docs.typeset.sh/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.typeset.sh/advanced-guides/javascript.md).

# JavaScript

PDF supports JavaScript for various purposes, such as form validation. However, please note that typeset.sh itself does not parse JavaScript like a browser would. Instead, scripts are attached to the PDF and executed by the client's PDF viewer application.

Not all viewer support all futures and events.

To include `<script>` tags, the `data-pdf` attribute must be present. This precaution is taken to avoid including any scripts by default.

PDF supports document event handlers that can be subscribed to by adding the attribute `data-on="EventType"`. The following event types are available:

```
WillClose
WillSave
DidSave
WillPrint
DidPrint
```

Ohter ineraction events (onclick, onmousedown, etc.) only work on form fields.

#### Simple JavaScript Example

```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>javascript.html</title>
    <style>
        @page {
            size: A4;
            margin: 10mm;
        }
    </style>
    <script type="text/javascript" data-pdf>
        var counter = 0;
        function test(event) {
            app.alert((++counter) + " Hello from "+app.viewerType+" by clicking "+event.target.name);
        }

        function validate() {
            app.alert("Email: " + this.getField("email").value);
        }
    </script>

    <script type="text/javascript" data-pdf data-on="didSave">
        app.alert("Saving complete");
    </script>

</head>
<body>
    <div>
        <input type="checkbox" name="foo" value="1" onclick="test(event)" />

        <input type="radio" name="bar" value="1" onclick="test(event)" checked />
        <input type="radio" name="bar" value="2" onclick="test(event)" />

        <input type="text" 
               name="email" 
               onmouseenter="console.println('email onmouseenter')"
               onmousedown="console.println('email onmousedown')"
               onmouseleave="console.println('email onmouseleave')"
               onmouseover="console.println('email onmouseover')"
               onmouseup="console.println('email onmouseup')"
               onfocus="console.println('email onfocus')"
               onblur="console.println('email onblur')"
               onkeystroke="console.println('email onkeystroke')"
               onvalidate="console.println('email onvalidate')"
               oncalculate="console.println('email oncalculate')"
               value="contact@typeset.sh" />
    </div>
    <div>
        <button onclick="validate()">Validate</button>
    </div>
</body>
</html>

```

More information can be found here: <https://opensource.adobe.com/dc-acrobat-sdk-docs/acrobatsdk/pdfs/acrobatsdk_jsapiref.pdf>
