# JavaScript API

> Control the DS Server Document Editor with the TXTextControl object and the Document Viewer with TXDocumentViewer: scripts, init settings, events and reference.

- **Product:** DS Server
- **Section:** Documentation
- **Kind:** Topic
- **Path:** DS Server > API Reference > JavaScript API
- **1151 words**
- **Web URL:** https://docs.textcontrol.com/ds-server/reference/javascript-api/
- **LLMs URL:** https://docs.textcontrol.com/ds-server/reference/javascript-api/llms.txt
- **LLMs-Full URL:** https://docs.textcontrol.com/ds-server/reference/javascript-api/llms-full.txt

---

In the browser, your code controls the Document Editor through the `TXTextControl` object and the Document Viewer through the `TXDocumentViewer` object. Both scripts come from DS Server, and both objects are the same whether a client library created the component or your own HTML page did. Their references list every object, property, method and event with its syntax and parameters.

The two objects are independent APIs with their own conventions. Knowing how each one is created and when it is ready makes the reference pages easier to use.

### The Two APIs

|  | Document Editor | Document Viewer |
|---|---|---|
| Object | [TXTextControl](https://docs.textcontrol.com/ds-server/reference/javascript/txtextcontrol/llms-full.txt) | [TXDocumentViewer](https://docs.textcontrol.com/ds-server/reference/javascript-document-viewer/txdocumentviewer/llms-full.txt) |
| What it controls | The document in the editor: text, formatting, tables, images, fields, sections, tracked changes, comments, the selection and the ribbon | The displayed document: loading and saving, search, printing, annotations, form fields, tracked changes, signatures and the toolbar |
| Script on DS Server | `<serviceURL>/documenteditor/JS/ds-server-document-editor.js` | `<serviceURL>/documentviewer/TextControl/GetResource?Resource=minimized.tx-viewer.min.js` |
| Created by | [TXTextControl.init](https://docs.textcontrol.com/ds-server/reference/javascript/txtextcontrol/init-method/llms-full.txt) | `TXDocumentViewer.init` |
| Events | [addEventListener](https://docs.textcontrol.com/ds-server/reference/javascript/txtextcontrol/addeventlistener-method/llms-full.txt) of `TXTextControl`, such as `textControlLoaded` | [addEventListener](https://docs.textcontrol.com/ds-server/reference/javascript-document-viewer/documentviewercontroller/addeventlistener-method/llms-full.txt) of `TXDocumentViewer` |
| How methods return results | Asynchronous methods pass their results to callback functions | Loading and saving return promises; most other members return their result directly |

Enumerations of the editor are properties of its object, such as `TXTextControl.StreamType`, and the viewer has its own, such as `TXDocumentViewer.StreamType`.

### How DS Server Connects the Objects

The JavaScript APIs are TX Text Control's, and DS Server adds how the component reaches the server. The client libraries show the settings they pass:

- **Document Editor.** `TXTextControl.init` receives the `containerID` of the element to fill, the `serviceURL` of DS Server, `authSettings` with either `clientId` and `clientSecret` or an `accessToken`, and the `editorSettings` described by [DocumentEditorSettings](https://docs.textcontrol.com/ds-server/reference/javascript/documenteditorsettings/llms-full.txt). `serviceURL` and `authSettings` belong to DS Server and are not members of [ComponentSettings](https://docs.textcontrol.com/ds-server/reference/javascript/componentsettings/llms-full.txt) in the reference.
- **Document Viewer.** The script URL carries the access token in the `access_token` query parameter. `TXDocumentViewer.init` receives the `containerID` and `viewerSettings`, with `basePath` set to `<serviceURL>/documentviewer` and the token in `oauthSettings.accessToken`. [DocumentLoadSettings](https://docs.textcontrol.com/ds-server/reference/javascript-document-viewer/documentloadsettings/llms-full.txt) and [SignatureSettings](https://docs.textcontrol.com/ds-server/reference/javascript-document-viewer/signaturesettings/llms-full.txt) are documented in the reference.

The [Angular](https://docs.textcontrol.com/ds-server/client-libraries/angular/llms-full.txt) and [React](https://docs.textcontrol.com/ds-server/client-libraries/react/llms-full.txt) components do all of this and tell you when the object exists: the Angular components raise `dsDocumentEditorLoaded` and `dsDocumentViewerLoaded` on `document`, and the React components call `onLoad`. Without a component, [JavaScript](https://docs.textcontrol.com/ds-server/getting-started/document-editor/javascript/llms-full.txt) in Getting Started loads the editor from a plain HTML page.

### How the Reference Is Organized

Each API has a page per object. The main objects, `TXTextControl` and `TXDocumentViewer`, lead to the objects your code reaches through their properties, such as the tables of a document or the annotations in the viewer. The page of an object lists its properties, methods and events, and the page of a member shows its syntax, its parameters and the value or callback it returns. The Document Editor's reference also documents the callback types and the objects that event handlers receive.

### Find the Right Page

| If you want to | Read |
|---|---|
| Look up a member of the editor | [Document Editor](https://docs.textcontrol.com/ds-server/reference/javascript/llms-full.txt) |
| Look up a member of the viewer | [Document Viewer](https://docs.textcontrol.com/ds-server/reference/javascript-document-viewer/llms-full.txt) |
| Load a document into the editor | [loadDocument](https://docs.textcontrol.com/ds-server/reference/javascript/txtextcontrol/loaddocument-method/llms-full.txt) |
| Offer merge fields from JSON data in the editor | [loadJsonData](https://docs.textcontrol.com/ds-server/reference/javascript/txtextcontrol/loadjsondata-method/llms-full.txt) |
| Configure the Angular or React components that create the objects | [Angular](https://docs.textcontrol.com/ds-server/client-libraries/angular/llms-full.txt) or [React](https://docs.textcontrol.com/ds-server/client-libraries/react/llms-full.txt) |
| Configure the Document Editor or Document Viewer in an ASP.NET Core view | [ASP.NET Core](https://docs.textcontrol.com/ds-server/client-libraries/aspnet-core/llms-full.txt) |

### Pages in This Section

- [Document Editor](https://docs.textcontrol.com/ds-server/reference/javascript/llms-full.txt): the reference of the `TXTextControl` object and the objects below it.
- [Document Viewer](https://docs.textcontrol.com/ds-server/reference/javascript-document-viewer/llms-full.txt): the reference of the `TXDocumentViewer` object and the objects below it.

---

## Nearby

- **Previous:** [TXTextControl.DocumentServices.Plugin.Abstractions](https://docs.textcontrol.com/ds-server/reference/dotnet-api/txtextcontrol-documentservices-plugin-abstractions/llms-full.txt)
- **Next:** [JavaScript API](https://docs.textcontrol.com/ds-server/reference/javascript/llms-full.txt)
