### Query Documentation API Example

Source: https://help.form.io/developers/form-development/translations

Illustrates how to query the documentation dynamically by making an HTTP GET request to a specific URL with an 'ask' query parameter.

```http
GET https://help.form.io/developers/form-development/translations.md?ask=<question>
```

--------------------------------

### Dynamic Documentation Query

Source: https://help.form.io/developers/auth/email-login

This example shows how to query the documentation dynamically using an HTTP GET request with the 'ask' query parameter. This is useful for retrieving specific information or clarification not explicitly present on the page.

```http
GET https://help.form.io/developers/auth/email-login.md?ask=<question>
```

--------------------------------

### API Example: Query Documentation

Source: https://help.form.io/developers/introduction/application

To get additional information not directly on the page, make an HTTP GET request to the page URL with an 'ask' query parameter. The question should be specific and self-contained.

```http
GET https://help.form.io/developers/introduction/application.md?ask=<question>
```

--------------------------------

### Install Standard Template

Source: https://help.form.io/developers/form-development/form-templates/the-form.io-standard-template

Install the Form.io Standard Template package using npm.

```bash
npm install @formio/standard-template
```

--------------------------------

### Example Email Registration

Source: https://help.form.io/developers/auth/email-login

This example demonstrates how to construct an email to a customer for registration, including a token that links to your application and specifies the registration state.

```text
  To:      john@example.com
  From:    no-reply@form.io
  Subject: Register Now
  Message: Click here to complete your registration http://myapp.com/?token=[[token(data.email=customer)]]#register
```

--------------------------------

### Install Form.io SDK via npm

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Install the Form.io SDK as a dependency in your project using npm.

```bash
npm install --save formiojs
```

--------------------------------

### Framework Plugin Example

Source: https://help.form.io/developers/modules

A simple example of the framework plugin, used to set the default template framework for the renderer.

```json
{
  framework: 'semantic'
}
```

--------------------------------

### Install Offline Plugin

Source: https://help.form.io/developers/offline-mode

Install the offline-plugin library using npm.

```bash
npm install @formio/offline-plugin
```

--------------------------------

### Making a GET Request with 'ask' Parameter

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Demonstrates how to query documentation dynamically by appending an 'ask' query parameter to a GET request URL. This allows for natural language questions to retrieve specific information.

```http
GET https://help.form.io/developers/javascript-development/javascript-sdk.md?ask=<question>
```

--------------------------------

### Install Angular Material Form.io

Source: https://help.form.io/developers/javascript-development/frameworks

Install the necessary packages for integrating Form.io with Angular Material using npm.

```bash
npm install formiojs @formio/angular @formio/angular-material
```

--------------------------------

### Query Documentation via API

Source: https://help.form.io/developers/form-development/form-templates/the-form.io-standard-template

Demonstrates how to query the documentation dynamically by making an HTTP GET request with an 'ask' query parameter.

```http
GET https://help.form.io/developers/form-development/form-templates/the-form.io-standard-template.md?ask=<question>
```

--------------------------------

### Wiredep Usage with Node.js

Source: https://help.form.io/developers/javascript-development/frameworks

Example of using the Wiredep library in a Node.js environment to wire up dependencies for the basic ngFormio installation.

```javascript
$ node
> require('wiredep')({ src: 'index.html' });
```

--------------------------------

### Querying Documentation via GET Request

Source: https://help.form.io/developers/form-development/form-renderer

Demonstrates how to query the documentation dynamically by appending an 'ask' query parameter to the page URL.

```http
GET https://help.form.io/developers/form-development/form-renderer.md?ask=<question>
```

--------------------------------

### Query Documentation with HTTP GET

Source: https://help.form.io/developers/javascript-development/frameworks

Perform an HTTP GET request to query the documentation dynamically. Use the `ask` query parameter with a specific, self-contained question in natural language. The response will include a direct answer and relevant excerpts.

```http
GET https://help.form.io/developers/javascript-development/frameworks.md?ask=<question>
```

--------------------------------

### Serve Angular Application

Source: https://help.form.io/developers/introduction/application

Starts the Angular development server, making the application accessible at http://localhost:4200.

```bash
ng serve
```

--------------------------------

### Query Documentation via HTTP GET

Source: https://help.form.io/developers/audit-logging

Perform an HTTP GET request on the current page URL with the `ask` query parameter to dynamically query the documentation. The question should be specific and self-contained.

```http
GET https://help.form.io/developers/audit-logging.md?ask=<question>
```

--------------------------------

### Install Application Dependencies

Source: https://help.form.io/developers/introduction/application

Installs necessary packages including Bootstrap, Bootstrap Icons, Form.io JS, Angular Elements, ngx-bootstrap, and the Form.io Angular library.

```bash
npm install --save bootstrap@4 bootstrap-icons formiojs @angular/elements ngx-bootstrap --legacy-peer-deps;
npm install --save @formio/angular --tag=rc --legacy-peer-deps
```

--------------------------------

### Query Documentation with GET Request

Source: https://help.form.io/developers/form-development/form-templates

Perform an HTTP GET request to a URL with an 'ask' query parameter to dynamically query documentation. The question should be specific and in natural language.

```http
GET https://help.form.io/developers/form-development/form-templates.md?ask=<question>
```

--------------------------------

### Install Protected Evaluator

Source: https://help.form.io/developers/form-development/form-evaluations/protected-evaluator

Install the Protected Evaluator module using npm. This is the first step before importing it into your application.

```bash
npm install --save @formio/protected-eval
```

--------------------------------

### Basic Installation HTML Structure

Source: https://help.form.io/developers/javascript-development/frameworks

This HTML structure is used with the basic ngFormio installation, typically wired up using tools like Wiredep.

```html
<html>
<head>
  <!-- bower:css -->
  <!-- endbower -->
</head>
<body>
  <!-- bower:js -->
  <!-- endbower -->
</body>
</html>
```

--------------------------------

### Install and Use Form.io Renderer in Application

Source: https://help.form.io/developers/javascript-development/frameworks

Install the formiojs package via npm and import it to create a form within your application. Ensure the CSS is also included.

```javascript
npm install formiojs
```

```javascript
import { Formio } from 'formiojs';
Formio.createForm(document.getElementById('formio'), 'https://examples.form.io/example');
```

```javascript
@import "~formiojs/dist/formio.form.min.css";
```

--------------------------------

### Query Documentation Dynamically

Source: https://help.form.io/developers/form-development/form-evaluations/protected-evaluator

To get more information not directly on the page, make a GET request to the current URL with an 'ask' query parameter containing your question.

```http
GET https://help.form.io/developers/form-development/form-evaluations/protected-evaluator.md?ask=<question>
```

--------------------------------

### Query Documentation via HTTP GET

Source: https://help.form.io/developers

Perform an HTTP GET request on a documentation URL with the 'ask' query parameter to retrieve dynamic answers to specific questions. The question should be self-contained and in natural language. Use this when information is not explicitly present or clarification is needed.

```HTTP
GET https://help.form.io/developers.md?ask=<question>
```

--------------------------------

### Full Installation of ngFormio

Source: https://help.form.io/developers/javascript-development/frameworks

Use this installation if your application does not already have Angular and jQuery and you wish to display a single form on a page.

```html
<link rel="stylesheet" href="https://rawgit.com/formio/ngFormio/master/dist/formio-full.min.css" />
<script src="https://rawgit.com/formio/ngFormio/master/dist/formio-full.min.js"></script>
```

--------------------------------

### Install Vue Renderer

Source: https://help.form.io/developers/javascript-development/frameworks

Install the Form.io Vue renderer using NPM. This is the first step to using the library in your Vue application.

```bash
npm install --save @formio/vue
```

--------------------------------

### Data Grid Component Example

Source: https://help.form.io/developers/form-development/form-renderer

Example of using the Data Grid component to structure submission data as an array of objects.

```APIDOC
## Data Grid Component Example

### Description
This example demonstrates how to use the `datagrid` component to create a structured array of objects within your form submission. It shows the JSON configuration for the component and the resulting submission data structure.

### Component Configuration
```json
{
  "components": [
    {
      "type": "datagrid",
      "label": "Children",
      "key": "children",
      "components": [
        {
          "type": "textfield",
          "key": "firstName",
          "label": "First Name"
        },
        {
          "type": "textfield",
          "key": "lastName",
          "label": "Last Name"
        }
      ]
    }
  ]
}
```

### Submission JSON Output
```json
{
  "data": {
    "children": [
      {
        "firstName": "Joe",
        "lastName": "Smith"
      },
      {
        "firstName": "Mary",
        "lastName": "Thompson"
      }
    ]
  }
}
```
```

--------------------------------

### Install Form.io React Dependencies

Source: https://help.form.io/developers/javascript-development/frameworks

Install the necessary Form.io JavaScript library and the React renderer via NPM. This is the first step to using Form.io within a React application.

```bash
npm install --save formiojs @formio/react
```

--------------------------------

### Rendering a Form with Submission Data

Source: https://help.form.io/developers/form-development/form-renderer

Example of how to create a form and then set its submission data.

```APIDOC
## Rendering a Form with Submission Data

### Description
This example shows how to initialize a form using `Formio.createForm` with a JSON component definition and then populate it with submission data. The submission data is assigned to the `form.submission` property after the form is created.

### JavaScript Code
```javascript
Formio.createForm(document.getElementById('formio'), {
  components: [
    {
      type: 'textfield',
      key: 'firstName',
      label: 'First Name'
    },
    {
      type: 'textfield',
      key: 'lastName',
      label: 'Last Name'
    }
  ]
}).then((form) => {
  form.submission = {
    data: {
      firstName: 'Joe',
      lastName: 'Smith'
    }
  };
});
```
```

--------------------------------

### Querying Documentation with 'ask' Parameter

Source: https://help.form.io/developers/roles-and-permissions

To get additional information not directly on the page, perform an HTTP GET request with the 'ask' query parameter. The question should be specific and self-contained.

```http
GET https://help.form.io/developers/roles-and-permissions.md?ask=<question>
```

--------------------------------

### Query Documentation Dynamically

Source: https://help.form.io/developers/form-development/form-builder

Perform an HTTP GET request on the current page URL with the `ask` query parameter to retrieve specific information or clarification from the documentation.

```HTTP
GET https://help.form.io/developers/form-development/form-builder.md?ask=<question>
```

--------------------------------

### Install and Use Form.io Angular Renderer

Source: https://help.form.io/developers/javascript-development/frameworks

Install formiojs and @formio/angular via npm. Import FormioModule into your Angular application's NgModule and use the formio component in your templates.

```javascript
npm install --save formiojs @formio/angular
```

```javascript
import { FormioModule } from '@formio/angular';
@NgModule({
    imports: [
        ...,
        FormioModule
    ],
    ...
})
export class AppModule { }
```

```html
<formio src='https://examples.form.io/example'></formio>
```

--------------------------------

### Navigate to Event Registrations URL

Source: https://help.form.io/developers/introduction/application

Example URL to access the event registration forms and view all registrations for a specific event.

```url
http://localhost:4200/event/[EVENTID]/registrations
```

--------------------------------

### Install Application Dependencies with Yarn

Source: https://help.form.io/developers/introduction/application

Installs necessary packages using Yarn, including Bootstrap, Bootstrap Icons, Form.io JS, Angular Elements, ngx-bootstrap, and the Form.io Angular library.

```bash
yarn add bootstrap@4 bootstrap-icons formiojs @angular/elements ngx-bootstrap;
yarn add @formio/angular@rc
```

--------------------------------

### Module Exports Structure

Source: https://help.form.io/developers/modules

Example of how to export a module from an external library, including framework, components, templates, and fetch plugins.

```javascript
export default {
  framework: 'semantic', // Sets the default template to a specific framework.
  components: {
    /* List of custom components */
  },
  templates: {
    semantic: {
      /* List of templates found @ https://github.com/formio/formio.js/blob/master/src/templates/bootstrap/index.js */
    }
  },
  fetch: {
    fetchname: CustomFetchPluginClass
  }
}
```

--------------------------------

### Run SeaweedFS Container

Source: https://help.form.io/developers/integrations/file-storage

Start the SeaweedFS container with S3 compatibility enabled. Ensure you update the AWS credentials and volume mapping as needed.

```bash
docker run -itd \
  -e "AWS_ACCESS_KEY_ID=CHANGEME" \
  -e "AWS_SECRET_ACCESS_KEY=CHANGEME" \
  --name formio-seaweedfs \
  --restart unless-stopped \
  -p 8333:8333 \
  -p 23646:23646 \
  -v ~/seaweedfs/data:/data \
  chrislusf/seaweedfs server -s3
```

--------------------------------

### Start SeaweedFS Admin

Source: https://help.form.io/developers/integrations/file-storage

Access the SeaweedFS admin interface to manage buckets and configurations. This command is executed within the running SeaweedFS container.

```bash
docker exec -it local-seaweedfs-1 /usr/bin/weed admin
```

--------------------------------

### Use Bootstrap 4 Template

Source: https://help.form.io/developers/form-development/form-templates

Import and use the Bootstrap 4 template instead of the default. Ensure the @formio/bootstrap package is installed.

```javascript
import { Formio } from '@formio/js';
import { bootstrap4 } from '@formio/bootstrap';

// use the Bootstrap 4-based template instead of the default
Formio.use(bootstrap4);
```

--------------------------------

### Perform Post-Instantiation Initialization

Source: https://help.form.io/developers/form-development/custom-components

The init method is called immediately after the component has been instantiated. It's a good place for any setup logic that needs to run after the constructor.

```javascript
/**
     * Called immediately after the component has been instantiated to initialize
     * the component.
     */
    init() {
        super.init();
    }
    
```

--------------------------------

### Bower Installation of ngFormio

Source: https://help.form.io/developers/javascript-development/frameworks

Install the ngFormio renderer library using Bower. This installation includes only the renderer with no dependencies.

```bash
bower install --save ng-formio
```

--------------------------------

### guid()

Source: https://help.form.io/developers/javascript-development/javascript-utilities

Generates a globally unique identifier (GUID).

```APIDOC
## guid()

### Description
Generate a GUID
```

--------------------------------

### API Endpoint for Dynamic Documentation Querying

Source: https://help.form.io/developers/auth/saml

This example shows how to query the documentation dynamically by appending an 'ask' query parameter to the URL. This is useful for retrieving specific information or clarifications not explicitly present on the page.

```http
GET https://help.form.io/developers/auth/saml.md?ask=<question>
```

--------------------------------

### SAML SSO Login Button and Callback Handler

Source: https://help.form.io/developers/auth/saml

This example shows how to create a 'Login' button that triggers SAML SSO and includes a script to handle the SAML callback when the page returns with the '?saml=' query parameter.

```html
<button class="btn btn-primary" role="button" onclick="Formio.ssoInit('saml')">Login</button>
<script type="text/javascript">  
  // Check to see if the saml query is provided.
  if (Formio.pageQuery().saml) {
    // Perform the login.
    Formio.ssoInit('saml');
    
    // Navigate to the homepage after they login.
    window.location.replace('/');
  }
</script>
```

--------------------------------

### Complete Installation of ngFormio

Source: https://help.form.io/developers/javascript-development/frameworks

Use this if you are embedding a form within an application that already has Angular.js and jQuery installed.

```html
<link rel="stylesheet" href="https://rawgit.com/formio/ngFormio/master/dist/formio-complete.min.css" />
<script src="https://rawgit.com/formio/ngFormio/master/dist/formio-complete.min.js"></script>
```

--------------------------------

### Configure Application Styles

Source: https://help.form.io/developers/introduction/application

Sets up SCSS variables and imports Bootstrap and Bootstrap Icons for application-wide styling.

```scss
$bootstrap-icons-font-dir:'../node_modules/bootstrap-icons/font/fonts';
@import "bootstrap/scss/bootstrap.scss";
@import "bootstrap-icons/font/bootstrap-icons.scss";
```

--------------------------------

### Instantiate SDK and Load Forms

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Instantiate the Formio SDK with a project URL and load all forms within that project.

```javascript
const formio = new Formio('https://formio.com/myproject');
formio.loadForms().then((forms) => {
  console.log(forms);
});
```

--------------------------------

### Instantiate Form Scope SDK

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Illustrates how to instantiate the Form.io SDK when targeting a specific form within a project.

```javascript
const formio = new Formio('https://forms.formio.com/myproject/myform');
```

--------------------------------

### Create Formio Instance

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Instantiate the Formio SDK with an endpoint URL and optional configuration options.

```javascript
const formio = new Formio(<endpoint>, [options]);
```

--------------------------------

### Instantiate SDK and Load Specific Submission

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Instantiate the Formio SDK with a specific submission URL and load that submission.

```javascript
const formio = new Formio('https://formio.com/myproject/myform/submission/23234234234234234');
formio.loadSubmission().then((submission) => {
  console.log(submission);
});
```

--------------------------------

### Load Project using Form.io SDK

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Load the current project's configuration. Requires the SDK to be instantiated at the project scope.

```javascript
formio.loadProject().then((project) => {
    // Prints the project JSON
    console.log(project);
});
```

--------------------------------

### Install and Use Protected Evaluator

Source: https://help.form.io/developers/form-development/form-evaluations

Install the `@formio/protected-eval` package using npm and integrate it into your Form.io project using `Formio.use()`. Refer to the GitHub repository for detailed usage information.

```bash
npm install --save @formio/protected-eval
```

```javascript
import ProtectedEval from '@formio/protected-eval';
import { Formio } from 'formiojs';
Formio.use(ProtectedEval);
```

--------------------------------

### formio.loadProject([query], [opts])

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Loads the project using the Project Load API. This method is available after instantiating the SDK at the project scope and accepts optional query and fetch options.

```APIDOC
## `formio.loadProject([query], [opts])`

Loads the project using the following Project Load API

| Parameter        | Description                                                                                       |
| ---------------- | ------------------------------------------------------------------------------------------------- |
| query (optional) | See [**Query Options**](/developers/javascript-development/javascript-sdk.md#query-options-query) |
| opts (optional)  | See [**Fetch Options**](/developers/javascript-development/javascript-sdk.md#fetch-options-opts)  |

```javascript
formio.loadProject().then((project) => {
    // Prints the project JSON
    console.log(project);
});
```
```

--------------------------------

### Create a New Project using Form.io SDK

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Save a new project by providing project details. The SDK must be instantiated with a base URL, not a specific project URL.

```javascript
const formio = new Formio('https://api.form.io');
formio.saveProject({
    "title": "New Project",
    "name": "proj980",
    "description": "An example application",
    "settings": {
        "cors": "*"
    }
}).then((project) => {
    // Prints the project that was saved via API.
    console.log(project);
});
```

--------------------------------

### Formio.ssoInit([type], [options])

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Initializes an SSO processes. This is used during SAML authentication processes to instantiate and continue a SAML SSO process.

```APIDOC
## Formio.ssoInit([type], [options])

### Description
Initializes an SSO processes. This is used during SAML authentication processes to instantiate and continue a SAML SSO process.

### Parameters
- **type** (string, optional) - The type of SSO process to initialize (e.g., 'saml').
- **options** (object, optional) - Additional options for SSO initialization.

### Example: Instantiate a SAML SSO process
Assuming that your project is configured for SAML, you can instantiate an SSO process by executing the following.
```javascript
Formio.ssoInit('saml')
```
```

--------------------------------

### Instantiate Form.io SDK at Project Scope

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Instantiate the SDK with a project URL to enable project-specific API methods.

```javascript
const formio = new Formio('https://forms.formio.com/myproject')
```

--------------------------------

### Query Form.io Documentation

Source: https://help.form.io/developers/introduction

To get additional information not directly present on a page, perform an HTTP GET request to the current page URL with the 'ask' query parameter. The question should be specific and in natural language.

```http
GET https://help.form.io/developers/introduction.md?ask=<question>
```

--------------------------------

### Query Form.io Documentation Dynamically

Source: https://help.form.io/developers/form-development/custom-components

Demonstrates how to query the Form.io documentation using an HTTP GET request with the 'ask' query parameter. This is useful for retrieving specific information or clarifications not explicitly present on a page.

```http
GET https://help.form.io/developers/form-development/custom-components.md?ask=<question>
```

--------------------------------

### Instantiate Form Builder with Options

Source: https://help.form.io/developers/form-development/form-builder

Illustrates how to instantiate the Form Builder with specific options, such as disabling certain components.

```javascript
Formio.builder(document.getElementById('formio'), 'https://examples.form.io/example', {
    disabled: ['email']
});
```

--------------------------------

### Get Component Value

Source: https://help.form.io/developers/form-development/custom-components

Retrieves the current value of the component's view data.

```javascript
getValue() {
    return super.getValue();
}
```

--------------------------------

### formio.loadSubmissions([query], [opts])

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Loads a view of submissions for a form. This implements the Get Submissions API.

```APIDOC
## formio.loadSubmissions([query], [opts])

### Description
Loads a view of submissions for a form. This implements the [Get Submissions API](https://apidocs.form.io/#1f207caa-9d04-3e81-2973-e4bf82ee5190)

### Parameters
#### Path Parameters
- **query** (object) - Optional - See [Query Options](/developers/javascript-development/javascript-sdk.md#query-options-query)
- **opts** (object) - Optional - See [Fetch Options](/developers/javascript-development/javascript-sdk.md#fetch-options-opts)

### Request Example: Load first 10 submissions, sort by descending created date
```javascript
formio.loadSubmissions({
  params: {
    sort: '-created'
  }
}).then((submissions) => {
  console.log(submissions);
});
```

### Request Example 2: Load first 20 submissions where the form field age is greater than 18, and sort by modified.
```javascript
formio.loadSubmissions({
    params: {
        sorted: 'modified',
        'data.age__gt': 18,
        limit: 20
    }
}).then((submissions) => {
    console.log(submissions);
});
```
```

--------------------------------

### Rendering a Form from a URL with Submission Data

Source: https://help.form.io/developers/form-development/form-renderer

Example of rendering a form from a URL and setting its submission data.

```APIDOC
## Rendering a Form from a URL with Submission Data

### Description
This example demonstrates how to create a form by providing a Form URL to `Formio.createForm`. After the form is created, submission data can be assigned to the `form.submission` property.

### JavaScript Code
```javascript
Formio.createForm(document.getElementById('formio'), 'https://examples.form.io/example')
    .then((form) => {
        form.submission = {
            data: {
                firstName: 'Mary',
                lastName: 'Thompson',
                email: 'mary@example.com'
            }
        };
    });
```
```

--------------------------------

### Formio.libraryReady

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Returns a promise that will resolve once the library of the provided name is ready to be used.

```APIDOC
## Formio.libraryReady(name)

Returns a promise that will resolve once the library of the provided name is ready to be used.

### Parameters

#### Path Parameters

- **name** (string) - Required - The name of the library to check if it is ready or not.

### Request Example

```javascript
Formio.libraryReady('lodash').then((_) => {
    // Lodash is now ready!
    console.log(_);
});
```
```

--------------------------------

### Retrieve a registered plugin

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Use this method to get an instance of a previously registered fetch plugin by its name.

```javascript
const plugin = Formio.getPlugin('customplugin');
```

--------------------------------

### Loading Forms

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Instantiate the Formio SDK and load all forms associated with a project.

```APIDOC
## Loading Forms

### Description
Instantiate the Formio SDK with a project URL and load all forms within that project.

### Method
```javascript
new Formio(projectUrl)
formio.loadForms()
```

### Parameters
*   `projectUrl` (string): The URL of the Formio project.

### Response
*   `forms` (Array): An array of form objects.

### Request Example
```javascript
const formio = new Formio('https://formio.com/myproject');
formio.loadForms().then((forms) => {
  console.log(forms);
});
```
```

--------------------------------

### Example Plugin: Delay Requests by 5 Seconds

Source: https://help.form.io/developers/javascript-development/javascript-sdk

This plugin demonstrates how to use `preRequest` and `request` hooks to delay all outgoing requests by 5 seconds and log a message when a request is made. It registers a plugin named 'delay' with Formio.

```javascript
var DelayPlugin = {
  priority: 0,
  preRequest: function(requestArgs) {
    return new Promise(function(resolve, reject){
      setTimeout(resolve, 5000);
    })
  },
  request: function(args) {
    console.log('Request has been made!', args);
    
    // You can alter the response by changing null to the response you wish to make.
    return Promise.resolve(null);
  }
}

Formio.registerPlugin(DelayPlugin, 'delay');
```

--------------------------------

### Get Next Queued Offline Submission

Source: https://help.form.io/developers/offline-mode

Retrieves the next submission request from the offline queue without removing it.

```javascript
plugin.getNextQueuedSubmission()
```

--------------------------------

### Get Number of Offline Submissions in Queue

Source: https://help.form.io/developers/offline-mode

Retrieves the current count of submission requests waiting in the offline queue.

```javascript
plugin.submissionQueueLength()
```

--------------------------------

### Disable Specific Form Field

Source: https://help.form.io/developers/form-development/form-renderer

Control the disabled state of individual form fields. This example disables the 'firstName' component.

```json
{
  "disabled": {
    "firstName": true
  }
}
```

--------------------------------

### Example Submission JSON for Data Grid

Source: https://help.form.io/developers/form-development/form-renderer

This JSON structure represents a submission with data organized by the Data Grid component.

```json
{
  "data": {
    "children": [
      {
        "firstName": "Joe",
        "lastName": "Smith"
      },
      {
        "firstName": "Mary",
        "lastName": "Thompson"
    ]
  }
}
```

--------------------------------

### Form JSON Structure

Source: https://help.form.io/developers/form-development/form-renderer

Example of a basic Form JSON structure defining text fields for first and last names.

```json
{
  "components": [
    {
      "type": "textfield",
      "key": "firstName",
      "label": "First Name"
    },
    {
      "type": "textfield",
      "key": "lastName",
      "label": "Last Name"
    }
  ]
}
```

--------------------------------

### Create Form with Options

Source: https://help.form.io/developers/form-development/form-renderer

Illustrates the basic structure for creating a form with customizable options. The options object is passed as the third argument.

```javascript
Formio.createForm(element, src|form, options)
```

--------------------------------

### HTMLComponent Base Class Example

Source: https://help.form.io/developers/form-development/form-renderer

This snippet shows the structure of a base HTMLComponent class, including a 'content' getter method that can be overridden.

```javascript
export default class HTMLComponent extends Component {
    ...
    
    get content() {
        return ...;
    }
    
    ...
}
```

--------------------------------

### Example Response for Form Submission

Source: https://help.form.io/developers/form-development/form-renderer

This JSON object represents a typical successful form submission, including metadata and submitted data.

```json
{
  "_id": "5fc7c4082a992abe68b247b9",
  "owner": "5fc7beeb2a992abe68b2475c",
  "roles": [],
  "_vid": 0,
  "_fvid": 1,
  "state": "submitted",
  "data": {
    "firstName": "Joe",
    "lastName": "Smith",
    "email": "joe@example.com",
    "phoneNumber": "(123) 123-1234"
  },
  "access": [],
  "form": "5fc7c25a2a992abe68b247b4",
  "project": "5fc7befe2a992abe68b24765",
  "externalIds": [],
  "created": "2020-12-02T16:42:48.128Z",
  "modified": "2020-12-02T16:42:48.129Z"
}
```

--------------------------------

### Get Current User Metadata

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Retrieves the metadata and information for the currently logged-in user, based on the JWT token stored in localStorage.

```javascript
formio.currentUser().then((user) => {
    // The current user.
    console.log(user);
});
```

--------------------------------

### Formio.loadProjects([query], [opts])

Source: https://help.form.io/developers/javascript-development/javascript-sdk

A static method to load all projects within the configured baseUrl of the SDK. It accepts optional query and fetch options.

```APIDOC
## `Formio.loadProjects([query], [opts])`

A static method to load all projects within the configured `baseUrl` of the SDK.

| Parameter        | Description                                                                                       |
| ---------------- | ------------------------------------------------------------------------------------------------- |
| query (optional) | See [**Query Options**](/developers/javascript-development/javascript-sdk.md#query-options-query) |
| opts (optional)  | See [**Fetch Options**](/developers/javascript-development/javascript-sdk.md#fetch-options-opts)  |
```

--------------------------------

### Create New Angular Application with CLI

Source: https://help.form.io/developers/introduction/application

Use the Angular CLI to generate a new Angular project with SCSS styling, routing, and non-strict mode.

```bash
npm install -g @angular/cli
ng new eventmanager --style=scss --routing=true --strict=false
```

--------------------------------

### attachWebform(element, instance)

Source: https://help.form.io/developers/form-development/form-renderer

Called once the webform has started its attach phase. This hook can be used to manipulate the DOM element the webform is attaching to.

```APIDOC
## attachWebform(element, instance)

### Description
Called once the webform has started its attach phase.

### Parameters
#### Parameters
- **element** (DOM Element) - The DOM element that the webform is attaching to.
- **instance** (Object) - The webform instance object.

The method should either return the "element" or another DOM element that will be used to attach the webform object to.
```

--------------------------------

### formio.downloadFile(file, [options])

Source: https://help.form.io/developers/javascript-development/javascript-sdk

Downloads a file from the provided storage system. Refer to the File Component documentation for specific usage and implementation details.

```APIDOC
## `formio.downloadFile(file, [options])`

Downloads a file from the provided storage system. See [File Component ](https://github.com/formio/formio.js/blob/master/src/components/file/File.js#L724)for specific usage and implementation details.
```

--------------------------------

### Use Custom Evaluation Context in Validation

Source: https://help.form.io/developers/form-development/form-evaluations

Example of how to use a custom 'validatePhone' function, defined in the evalContext, within a custom validation rule.

```javascript
valid = validatePhone(input) ? true : 'Phone number is invalid';
```