> For the complete documentation index, see [llms.txt](https://docs.agilecase.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.agilecase.com/developer-documentation/case-scripting/on-load-scripts.md).

# On Load Scripts

An on load script runs in the user's browser every time a case of a matching case type is opened. It is ordinary client-side JavaScript, so it can change what the user sees, fetch data and talk to other services, but it cannot write anything back into the case.

Use one when you want to react to a case as it is presented: warn about a value, surface something buried several tabs down, or pull in information from elsewhere.

## When it runs

The script is placed into the case page and runs once the page is ready, after the case data and the standard interface have loaded. It runs on every visit to the case, including when the user returns to it after a save.

Because it runs after the page is built, anything the script adds is not part of the saved case. It is display only, so it never appears in reports or document templates.

## What is available to your script

<table><thead><tr><th width="180">Available</th><th>Notes</th></tr></thead><tbody><tr><td><code>caseid</code></td><td>A variable holding the numeric ID of the case being viewed. Use it to build API calls.</td></tr><tr><td>jQuery</td><td>Loaded on the case page, so <code>$</code> is available and the script already runs at document ready. You do not need your own ready wrapper.</td></tr><tr><td><code>#scriptingTarget</code></td><td>An empty container near the top of the case page, provided for scripts to write into.</td></tr><tr><td><a href="/pages/ZQDXBT5ispKejoaCxudN">Case Data API</a></td><td>How you read case values, including custom fields, contacts and tables.</td></tr></tbody></table>

A minimal script that reads one custom field and writes a message onto the case looks like this:

```javascript
$.get('/api/case/' + caseid + '/data?getValues=Custom.CustomerRating', function (data) {
    var value = data.data.customFields[0].value;
    if (value < 50) {
        $('#scriptingTarget').html('<div class="alert alert-danger">This customer has a negative rating</div>');
    }
});
```

## Writing to the page

`#scriptingTarget` is the supported place to put your own content, and it sits where the user will see it as the case opens. Writing into it with `.html()` replaces anything already there, so if you have more than one script contributing to the same case, use `.append()` instead, or give each script its own child element.

You can reach the rest of the page with jQuery as well, but the surrounding markup is not a published interface and may change between releases, so anything beyond `#scriptingTarget` is worth re-testing after an upgrade.

{% hint style="warning" %}
Every on load script attached to the case type runs on the same page, in the same scope. A syntax error in one script can stop the others from running, and two scripts declaring the same variable name will collide. Keep each script self-contained, ideally wrapped in its own function.
{% endhint %}

## Examples

<table data-view="cards"><thead><tr><th>Example</th><th>What it shows</th><th data-card-target data-type="content-ref">Target</th></tr></thead><tbody><tr><td><strong>Custom Messages Within Cases</strong></td><td>Showing a different message depending on the value of a custom field.</td><td><a href="/pages/TQykIF2eZyvyKeMvaH98">/pages/TQykIF2eZyvyKeMvaH98</a></td></tr><tr><td><strong>Add Custom Field Data To Main Case Panel</strong></td><td>Lifting a value out of a custom field group onto the front of the case.</td><td><a href="/pages/HEwzEZvnsyaMincm5zl0">/pages/HEwzEZvnsyaMincm5zl0</a></td></tr><tr><td><strong>Integrating with 3rd party services</strong></td><td>Passing case data to an external service and rendering what comes back.</td><td><a href="/pages/aRVfjrjOd5I1SXVOfSOG">/pages/aRVfjrjOd5I1SXVOfSOG</a></td></tr></tbody></table>

## Adding one

On load scripts are created in the same place as on save scripts. Choose the on load option when you set the script's type, as described in [Adding a New Script](/developer-documentation/case-scripting/adding-a-new-script.md).


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.agilecase.com/developer-documentation/case-scripting/on-load-scripts.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
