### Install dependencies, build clients, and start server

Source: https://surveyjs.io/form-library/documentation/multi-user-form-filling

Install npm dependencies, build the clients, and start the server. After running, open http://localhost:3001.

```bash
npm install
npm run build
npm run start
```

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

### Install @lk77/vue3-color

Source: https://surveyjs.io/form-library/documentation/customize-question-types/third-party-component-integration-vue

Run this command to install the Vue 3 Color component used as an example in this integration.

```bash
npm install @lk77/vue3-color
```

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

### Run the service locally with npm

Source: https://surveyjs.io/form-library/documentation/survey-json-validation

Install dependencies and start the service locally. The service will be available at http://localhost:3000.

```bash
npm i
npm run dev
```

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

### startSurveyText property

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model

Gets or sets a caption for the Start button.

```APIDOC
## startSurveyText property

### Description
Gets or sets a caption for the Start button.

### Type
string (writable)

### Implemented in
SurveyModel

### See also
- firstPageIsStartPage
- Localization & Globalization
```

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

### start method

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model

Starts the survey. Applies only if the survey has a start page.

```APIDOC
## start method

### Description
Starts the survey. Applies only if the survey has a start page.

### Type
() => boolean

### Implemented in
SurveyModel

### See also
- firstPageIsStartPage
- completeLastPage
```

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

### Install survey-react-ui npm package

Source: https://surveyjs.io/form-library/documentation/get-started-react

Run this command to install the survey-react-ui package. The survey-core package is installed automatically as a dependency.

```bash
npm install survey-react-ui
```

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

### Install ngx-color

Source: https://surveyjs.io/form-library/documentation/customize-question-types/third-party-component-integration-angular

Installs the ngx-color package, which provides the Angular Color component used as an example for integrating third-party components.

```bash
npm install ngx-color

```

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

### Enable start page and set start button text

Source: https://surveyjs.io/form-library/documentation/design-survey/create-a-multi-page-survey

Sets firstPageIsStartPage to true to add a Start button to the start page, and startSurveyText to change the button caption.

```javascript
const surveyJson = {
    firstPageIsStartPage: true,
    startSurveyText: "Take the Survey",
};

```

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

### Install react-color and its TypeScript types

Source: https://surveyjs.io/form-library/documentation/customize-question-types/third-party-component-integration-react

Run this command to install the react-color component and its TypeScript type definitions.

```bash
npm install react-color @types/react-color

```

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

### firstPageIsStartPage property

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model?id=PageModel

Gets or sets a Boolean value that specifies whether the first page is a start page.

```APIDOC
## firstPageIsStartPage property

### Description
Gets or sets a Boolean value that specifies whether the first page is a start page. Refer to the following help topic for more information: Start Page.

### Type
boolean (readonly)

### Notes
This property is stored in the survey JSON definition and can be edited in the Survey Creator.

### Implemented in
SurveyModel

### Available since
v2.0.0

### See also
- startPage
- activePage
```

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

### Install survey-angular-ui npm package

Source: https://surveyjs.io/form-library/documentation/get-started-angular

Run this command to install the survey-angular-ui package. The survey-core package is installed automatically as a dependency.

```bash
npm install survey-angular-ui
```

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

### Start page with introductory message and name input

Source: https://surveyjs.io/form-library/documentation/design-survey-create-a-quiz

The first page in the pages array serves as the start page. It contains an HTML introduction and a required text input for the user's name.

```javascript
const surveyJson = {
  pages: [{
    elements: [{
      type: "html",
      html: "You are about to start a quiz on American history. <br>You will have 10 seconds for every question and 25 seconds to end the quiz.<br>Enter your name below and click <b>Start Quiz</b> to begin."
    }, {
      type: "text",
      name: "username",
      titleLocation: "hidden",
      isRequired: true
    }]
  },
  // ...
  // Other quiz pages are configured here
  // ...
  ]
};
```

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

### Full Code: Fonts, Styles, Model, and SurveyComponent

Source: https://surveyjs.io/form-library/documentation/get-started-vue

Complete example combining font imports, style import, model definition, and survey rendering. This is the 'View Full Code' block that shows the entire setup.

```TypeScript
// main.ts
import '@fontsource/open-sans/400.css';
import '@fontsource/open-sans/600.css';
import '@fontsource/open-sans/700.css';

```

```Vue
<script setup lang="ts">
import 'survey-core/survey-core.css';
import { Model } from 'survey-core';

const surveyJson = {
  elements: [{
    name: "FirstName",
    title: "Enter your first name:",
    type: "text"
  }, {
    name: "LastName",
    title: "Enter your last name:",
    type: "text"
  }]
};

const survey = new Model(surveyJson);
</script>

<template>
  <!-- ... -->
</template>

```

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

### Install survey-vue3-ui npm package

Source: https://surveyjs.io/form-library/documentation/get-started-vue

Run this command to install the SurveyJS Form Library for Vue 3. The survey-core package is installed automatically as a dependency.

```bash
npm install survey-vue3-ui
```

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

### Full example: font imports, Survey component, and page

Source: https://surveyjs.io/form-library/documentation/get-started-react

Complete code for the survey example, including font imports, the Survey component with styles and model, and the page that renders it.

```tsx
// app/layout.tsx or pages/_app.tsx
import '@fontsource/open-sans/400.css';
import '@fontsource/open-sans/600.css';
import '@fontsource/open-sans/700.css';
```

```tsx
// components/Survey.tsx
'use client'

import 'survey-core/survey-core.css';
import { useMemo } from 'react';
import { Model } from 'survey-core';
import { Survey } from 'survey-react-ui';

const surveyJson = {
  elements: [{
    name: "FirstName",
    title: "Enter your first name:",
    type: "text"
  }, {
    name: "LastName",
    title: "Enter your last name:",
    type: "text"
  }]
};

export default function SurveyComponent() {
  const survey = useMemo(() => new Model(surveyJson), [surveyJson]);

  return <Survey model={survey} />;
}
```

```tsx
// survey/page.tsx
import SurveyComponent from '@/components/Survey';

export default function Survey() {
  return (
    <SurveyComponent />
  );
}
```

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

### today function examples

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Returns current date or date shifted by days. Examples show no argument and with argument.

```json
"expression": "today()"
"expression": "today(2)"
```

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

### Configure a start page with HTML content

Source: https://surveyjs.io/form-library/documentation/design-survey/create-a-multi-page-survey

Defines a survey JSON where the first page contains an HTML element with introductory markup. This page does not affect survey progress and users cannot return to it once they start the survey.

```javascript
const surveyJson = {
    pages: [{
        elements: [{
            type: "html",
            html: "<h2>In this survey, we will ask you a couple questions about your impressions of our product.</h2>"
        }]
    },
    // ...
    // Other pages are configured here
    // ...
    ],
};

```

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

### Access the start page via survey.startPage

Source: https://surveyjs.io/form-library/documentation/design-survey/create-a-multi-page-survey

Creates a Survey.Model instance from the survey JSON and retrieves the start page using the startPage property.

```javascript
const survey = new Survey.Model(surveyJson);

const startPage = survey.startPage;

```

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

### isStartPage property

Source: https://surveyjs.io/form-library/documentation/api-reference/page-model

Returns `true` if this page is a start page.

```APIDOC
## isStartPage property

### Description
Returns `true` if this page is a start page.
Refer to the following help topic for more information on how to configure a start page: Start Page.

### Type
boolean **readonly**

### Implemented in
PageModel
```

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

### showNavigationButtons property

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model

Gets or sets the visibility of the Start, Next, Previous, and Complete navigation buttons. Possible values: true (default) or false.

```APIDOC
## showNavigationButtons property

### Description
Gets or sets the visibility of the Start, Next, Previous, and Complete navigation buttons.
Possible values:
- `true` (default) - Displays the navigation buttons.
- `false` - Hides the navigation buttons. This setting may be useful if you implement custom external navigation.

### Type
any (writable)

### Default Value
True

### Implemented In
SurveyModel

### See Also
- navigationButtonsLocation
- autoAdvanceEnabled
- showPrevButton
- showCompleteButton
```

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

### Install Open Sans Font Package

Source: https://surveyjs.io/form-library/documentation/get-started-vue

Run this npm command to install the @fontsource/open-sans package, which provides the Open Sans font. This is required because SurveyJS v3.0.4+ no longer includes fonts.

```bash
npm install @fontsource/open-sans

```

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

### startPage property

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model

Returns the start page. Applies only if the `firstPageIsStartPage` property is set to `true`.

```APIDOC
## startPage property

### Description
Returns the start page. Applies only if the `firstPageIsStartPage` property is set to `true`.

### Type
PageModel (readonly)

### Implemented in
SurveyModel

### Available since
v2.0.0

### See also
- firstPageIsStartPage
- activePage
```

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

### Full survey model with start page and conditional pages

Source: https://surveyjs.io/form-library/documentation/design-survey/create-a-multi-page-survey

A complete survey JSON configuration that includes a start page, a satisfaction score question, conditional pages based on the score, and settings for navigation text and start page behavior.

```javascript
const surveyJson = {
    pages: [{
        elements: [{
            type: "html",
            html: "<h2>In this survey, we will ask you a couple questions about your impressions of our product.</h2>"
        }]
    }, {
        elements: [{
            name: "satisfaction-score",
            title: "How would you describe your experience with our product?",
            type: "radiogroup",
            choices: [
                { value: 5, text: "Fully satisfying" },
                { value: 4, text: "Generally satisfying" },
                { value: 3, text: "Neutral" },
                { value: 2, text: "Rather unsatisfying" },
                { value: 1, text: "Not satisfying at all" }
            ],
            isRequired: true
        }]
    }, {
        elements: [{
            name: "what-would-make-you-more-satisfied",
            title: "What can we do to make your experience more satisfying?",
            type: "comment",
            visibleIf: "{satisfaction-score} = 4"
        }, {
            name: "nps-score",
            title: "On a scale of zero to ten, how likely are you to recommend our product to a friend or colleague?",
            type: "rating",
            rateMin: 0,
            rateMax: 10
        }],
        visibleIf: "{satisfaction-score} >= 4"
    }, {
        elements: [{
            name: "how-can-we-improve",
            title: "In your opinion, how could we improve our product?",
            type: "comment"
        }],
        visibleIf: "{satisfaction-score} = 3"
    }, {
        elements: [{
            name: "disappointing-experience",
            title: "Please let us know why you had such a disappointing experience with our product",
            type: "comment"
        }],
        visibleIf: "{satisfaction-score} =< 2"
    }],
    pageNextText: "Forward",
    completeText: "Submit",
    showPrevButton: false,
    firstPageIsStartPage: true,
    startSurveyText: "Take the Survey",
};

```

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

### Install SurveyJS Form Library for Plain JavaScript

Source: https://surveyjs.io/form-library/documentation/overview

Install the SurveyJS Form Library package for plain JavaScript applications. This command installs the survey-js-ui package, which also installs the framework-independent survey-core package.

```bash
npm install survey-js-ui
```

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

### Custom question start index with questionStartIndex

Source: https://surveyjs.io/form-library/documentation/design-survey-configure-question-titles

Sets Survey's questionStartIndex to customize the starting number or letter, including prefixes and postfixes. Examples show "a.", "#3", and "(B).".

```json
const surveyJson = {
  // ...
  "questionStartIndex": "a.", // a., b., c., ...
  "questionStartIndex": "#3", // #3, #4, #5, ...
  "questionStartIndex": "(B)." // (B)., (C)., (D)., ...
}
```

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

### minInArray example data

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Sample matrixdynamic data used in the minInArray examples.

```json
{
  matrixdynamic: [
    { name: "A", price: 10, active: false },
    { name: "B", price: 20, active: true },
    { name: "C", price: 30, active: true }
  ]
}
```

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

### Full Code: Complete Vue Survey Example

Source: https://surveyjs.io/form-library/documentation/get-started-vue

Complete example that includes font imports, style import, model definition, and SurveyComponent rendering. This is the final 'View Full Code' block.

```TypeScript
// main.ts
import '@fontsource/open-sans/400.css';
import '@fontsource/open-sans/600.css';
import '@fontsource/open-sans/700.css';

```

```Vue
<script setup lang="ts">
import 'survey-core/survey-core.css';
import { Model } from 'survey-core';
import { SurveyComponent } from 'survey-vue3-ui';

const surveyJson = {
  elements: [{
    name: "FirstName",
    title: "Enter your first name:",
    type: "text"
  }, {
    name: "LastName",
    title: "Enter your last name:",
    type: "text"
  }]
};

const survey = new Model(surveyJson);
</script>

<template>
  <SurveyComponent :model="survey" />
</template>

```

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

### Full Angular survey example with app.component.html, app.component.ts, and app.module.ts

Source: https://surveyjs.io/form-library/documentation/get-started-angular

Full example of rendering a survey: the template binds the survey model, the component creates a Model from surveyJson, and the module imports SurveyModule. Replicating this code shows the survey with two text inputs.

```HTML
<!-- app.component.html -->
<survey [model]="surveyModel"></survey>


```

```TypeScript
// app.component.ts
import { Component, OnInit } from '@angular/core';
import { Model } from "survey-core";

const surveyJson = {
  elements: [{
    name: "FirstName",
    title: "Enter your first name:",
    type: "text"
  }, {
    name: "LastName",
    title: "Enter your last name:",
    type: "text"
  }]
};

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  title = 'My First Survey';
  surveyModel: Model;
  ngOnInit() {
    const survey = new Model(surveyJson);
    this.surveyModel = survey;
  }
}


```

```TypeScript
// app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { SurveyModule } from "survey-angular-ui";

import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    SurveyModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }


```

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

### maxInArray example data

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Sample matrixdynamic data used in the maxInArray examples.

```json
{
  matrixdynamic: [
    { name: "A", price: 10, active: true },
    { name: "B", price: 20, active: true },
    { name: "C", price: 30, active: false }
  ]
}
```

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

### Quiz JSON with time limits

Source: https://surveyjs.io/form-library/documentation/design-survey/create-a-quiz

Configure a quiz with a timer, per-page time limit of 10 seconds, overall time limit of 25 seconds, and a start page. The survey shows a progress bar at the bottom and starts with a 'Start Quiz' button.

```json
const surveyJson = {
  title: "American History",
  showProgressBar: true,
  progressBarLocation: "bottom",
  showTimer: true,
  timeLimitPerPage: 10,
  timeLimit: 25,
  firstPageIsStartPage: true,
  startSurveyText: "Start Quiz",
  pages: [{
    elements: [{
      type: "html",
      html: "You are about to start a quiz on American history. <br>You will have 10 seconds for every question and 25 seconds to end the quiz.<br>Enter your name below and click <b>Start Quiz</b> to begin."
    }, {
      type: "text",
      name: "username",
      titleLocation: "hidden",
      isRequired: true
    }]
  }, {
    elements: [{
      type: "radiogroup",
      name: "civilwar",
      title: "When was the American Civil War?",
      choices: [
        "1796-1803", "1810-1814", "1861-1865", "1939-1945"
      ],
      correctAnswer: "1861-1865"
    }]
  }, {
    elements: [{
      type: "radiogroup",
      name: "libertyordeath",
      title: "Whose quote is this: \"Give me liberty, or give me death\"?",
      choicesOrder: "random",
      choices: [
        "John Hancock", "James Madison", "Patrick Henry", "Samuel Adams"
      ],
      correctAnswer: "Patrick Henry"
    }]
  }, {
    elements: [{
      type: "radiogroup",
      name: "magnacarta",
      title: "What is Magna Carta?",
      choicesOrder: "random",
      choices: [
        "The foundation of the British parliamentary system",
        "The Great Seal of the monarchs of England",
        "The French Declaration of the Rights of Man",
        "The charter signed by the Pilgrims on the Mayflower"
      ],
      correctAnswer: "The foundation of the British parliamentary system"
    }]
  }]
};
```

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

### Deploy the service with Docker

Source: https://surveyjs.io/form-library/documentation/survey-json-validation

Build and run the service in a Docker container. The service will be available at http://localhost:3000.

```bash
docker build -t surveyjs-json-schema-validator .
docker run -d -p 3000:3000 surveyjs-json-schema-validator
```

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

### displayValue expression example

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Returns a question's display text. The second parameter gets the display text for a specific value; without it, returns the display text for the current value. This example gets the display text for value 5 in a Dropdown question.

```json
"expression": "displayValue('my-dropdown-question', 5)"
```

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

### isStartPageActive property

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model?id=Question

A Boolean value that indicates whether the start page is currently displayed.

```APIDOC
## isStartPageActive property

### Description
A Boolean value that indicates whether the start page is currently displayed.

### Type
boolean (readonly)

### Implemented In
SurveyModel

### Available Since
v2.0.0
```

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

### questionStartIndex

Source: https://surveyjs.io/form-library/documentation/api-reference/panelmodelbase?id=PanelModelBase

Gets or sets the starting number or letter for question numbering.

```APIDOC
## Property: questionStartIndex

### Description
Specifies a number or letter used to start numbering of elements inside this page/panel. You can include desired prefixes and postfixes alongside the number or letter.

### Type
`string` (readonly)

### Default Value
`"1."` (inherited from the `questionStartIndex` property specified for the parent panel, page, or survey)
```

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

### Install Open Sans font package

Source: https://surveyjs.io/form-library/documentation/get-started-angular

Starting with SurveyJS v3.0.4, fonts are not included in SurveyJS packages. Install @fontsource/open-sans to load Open Sans and preserve the default appearance.

```bash
npm install @fontsource/open-sans
```

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

### propertyValue expression example

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Returns the value of a property for a given question. This function is obsolete; use the dollar sign ($) syntax instead. This example gets the 'visible' property of 'question1'.

```json
"expression": "propertyValue('question1', 'visible')"
```

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

### previewText property

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model

Gets or sets a caption for the Preview button.

```APIDOC
## previewText property

### Description
Gets or sets a caption for the Preview button.

### Type
string (writable)

### Stored in Survey JSON
Yes

### Implemented In
SurveyModel

### See Also
- showPreviewBeforeComplete
- showPreview
- editText
```

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

### questionStartIndex property examples

Source: https://surveyjs.io/form-library/documentation/api-reference/page-model?id=PanelModelBase

Shows how to set the questionStartIndex property with different prefixes and postfixes to customize numbering of elements inside a panel/page.

```json
"questionStartIndex": "a.", // a., b., c., ...
"questionStartIndex": "#3", // #3, #4, #5, ...
"questionStartIndex": "(B)." // (B)., (C)., (D)., ...
```

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

### chooseFiles method

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model?id=Question

Opens a dialog window for users to select files. Accepts an input element, a callback to process selected files, and an optional context object.

```APIDOC
## chooseFiles method

### Description
Opens a dialog window for users to select files.

### Method Signature
(input: HTMLInputElement, callback: (files: File[]) => void, context?: { element: Base; item?: any; elementType?: string; propertyName?: string; }) => void

### Parameters
- **input** (HTMLInputElement) - Required - A file input HTML element.
- **callback** ((files: File[]) => void) - Required - A callback function that you can use to process selected files. Accepts an array of JavaScript File objects.
- **context** ({ element: Base; item?: any; elementType?: string; propertyName?: string; }) - Optional - Context object.

### Implemented in
SurveyModel

### See also
- onOpenFileChooser
- onUploadFile
```

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

### chooseFiles method

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model

Opens a dialog window for users to select files. Accepts an input element and a callback to process selected files.

```APIDOC
## chooseFiles method

### Description
Opens a dialog window for users to select files.

### Method Signature
`(input: HTMLInputElement, callback: (files: File[]) => void, context?: { element: Base; item?: any; elementType?: string; propertyName?: string; }) => void`

### Parameters
- **input** (HTMLInputElement) - Required - A file input HTML element.
- **callback** ((files: File[]) => void) - Required - A callback function that you can use to process selected files. Accepts an array of JavaScript File objects.
- **context** ({ element: Base; item?: any; elementType?: string; propertyName?: string; }) - Optional - Additional context.

### Implemented in
`SurveyModel`

### See also
- `onOpenFileChooser`
- `onUploadFile`
```

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

### visiblePages

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model

Returns an array of visible pages without the start page. To get an array of all pages, use the `pages` property.

```APIDOC
## visiblePages

### Description
Returns an array of visible pages without the start page. To get an array of all pages, use the `pages` property. If all pages are visible, the `pages` and `visiblePages` arrays are identical.

### Type
PageModel[] (readonly)

### Implemented in
SurveyModel

### See also
- Conditional Visibility
```

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

### navigationButtonsLocation property

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model?id=Base

Gets or sets the position of the Start, Next, Previous, and Complete navigation buttons. Applies only if the `showNavigationButtons` property is `true`.

```APIDOC
## navigationButtonsLocation property

### Description
Gets or sets the position of the Start, Next, Previous, and Complete navigation buttons. Applies only if the `showNavigationButtons` property is `true`.

### Type
any (readonly)

### Default value
bottom

### Accepted values
- top
- bottom
- topBottom

### Implemented in
SurveyModel

### Available since
v2.0.0

### See also
- autoAdvanceEnabled
- showPrevButton
- showCompleteButton
```

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

### minInArray usage examples

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Shows how to call minInArray with different arguments: returning the minimum value, the name of the item with the minimum value, and applying filters.

```javascript
"minInArray({matrixdynamic}, 'price')" // 10
"minInArray({matrixdynamic}, 'price', 'name')" // A
"minInArray({matrixdynamic}, 'price', active = true)" // 20
"minInArray({matrixdynamic}, 'price', 'name', active = true)" // B
```

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

### showNavigationButtons property

Source: https://surveyjs.io/form-library/documentation/api-reference/page-model?id=PanelModel

Gets or sets the visibility of the Start, Next, Previous, and Complete navigation buttons on this page. Overrides the survey-level setting. Default value is undefined.

```APIDOC
## showNavigationButtons property

### Description
Gets or sets the visibility of the Start, Next, Previous, and Complete navigation buttons on this page. Overrides the `showNavigationButtons` property specified on the survey-level.

### Type
string | boolean (writable)

### Default Value
`undefined` (the visibility depends on the survey-level setting)

### Implemented in
PageModel
```

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

### age function example

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Returns age according to a given birthdate.

```json
"expression": "age({birthdate})"
```

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

### showNavigationButtons property

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model?id=Base

Gets or sets the visibility of the Start, Next, Previous, and Complete navigation buttons. Possible values: `true` (default) - Displays the navigation buttons. `false` - Hides the navigation buttons. This setting may be useful if you implement custom external navigation. This property is stored in the survey JSON definition and can be edited in the Survey Creator.

```APIDOC
## showNavigationButtons property

### Description
Gets or sets the visibility of the Start, Next, Previous, and Complete navigation buttons. Possible values: `true` (default) - Displays the navigation buttons. `false` - Hides the navigation buttons. This setting may be useful if you implement custom external navigation. This property is stored in the survey JSON definition and can be edited in the Survey Creator.

### Type
any (writable)

### Default value
True

### Implemented in
SurveyModel

### See also
- navigationButtonsLocation
- autoAdvanceEnabled
- showPrevButton
- showCompleteButton
```

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

### startTimer method

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model

Starts a timer that calculates how many seconds a respondent has spent on the survey. Applies only to quiz surveys.

```APIDOC
## startTimer method

### Description
Starts a timer that calculates how many seconds a respondent has spent on the survey. Applies only to quiz surveys.

### Type
() => void

### Implemented in
SurveyModel

### See also
- stopTimer
- timeLimit
- timeLimitPerPage
- timeSpent
- onTimerTick
```

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

### show method

Source: https://surveyjs.io/form-library/documentation/api-reference/pop-up-survey-model

Shows the pop-up window.

```APIDOC
## show method

### Description
Shows the pop-up window.

### Type
() => void

### Implemented in
PopupSurveyModel
```

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

### Import linter functions from survey-core/linter

Source: https://surveyjs.io/form-library/documentation/survey-json-validation

Import lintSurvey, renderFindings, and getRules from the survey-core/linter entry point.

```javascript
import { lintSurvey, renderFindings, getRules } from "survey-core/linter";
```

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

### expand(focusFirstQuestion?: boolean) => void

Source: https://surveyjs.io/form-library/documentation/api-reference/panel-model?id=SurveyModel

Expands the panel. Optionally focuses the first question within the expanded panel.

```APIDOC
## expand(focusFirstQuestion?: boolean) => void

### Description
Expands the panel. Optionally focuses the first question within the expanded panel.

### Method
expand

### Parameters
- **focusFirstQuestion** (boolean) - Optional - Specifies whether to focus the first question within the expanded panel. Default value: `true`.

### Returns
void

### Implemented In
PanelModel
```

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

### day function examples

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Returns day of month (1-31) for given date or current day if omitted.

```json
"expression": "day({birthdate})"
"expression": "day()" // Current day of the month
```

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

### Call navigation methods and handle errors

Source: https://surveyjs.io/form-library/documentation/design-survey/create-a-multi-page-survey

Shows how to use start(), nextPage(), prevPage(), tryComplete(), and doComplete() methods on a Survey.Model instance, checking return values to handle navigation failures and validation errors.

```javascript
const survey = new Survey.Model(surveyJson);

survey.start();

const navigatedForward = survey.nextPage();
if (!navigatedForward) {
    alert("Navigation failed!")
}

const navigatedBack = survey.prevPage();
if (!navigatedBack) {
    alert("Navigation failed!")
}

const completedSuccessfully = survey.tryComplete();
if (!completedSuccessfully) {
    alert("Check the answers for validation errors")
}

survey.doComplete();

```

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

### month function examples

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Returns month of given date (1-12) or current month if omitted.

```json
"expression": "month({birthdate})"
"expression": "month()" // Current month
```

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

### onInit()

Source: https://surveyjs.io/form-library/documentation/api-reference/icustomquestiontypeconfiguration

A function that is called when the custom question type is initialized. Use it to add, remove, or modify the type's properties.

```APIDOC
## onInit()

### Description
A function that is called when the custom question type is initialized. Use it to add, remove, or modify the type's properties (see Override Base Question Properties).

### Method
onInit()

### Parameters
None.
```

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

### beginLoading method

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model

Displays the Loading page. This method is available since v2.0.0.

```APIDOC
## beginLoading

### Description
Displays the Loading page.

### Method
beginLoading(): void

### Implemented In
SurveyModel

### Available Since
v2.0.0

### See Also
- endLoading
```

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

### Provide known variables, functions, and components via options

Source: https://surveyjs.io/form-library/documentation/survey-json-validation

Shows how to declare runtime-provided names through options when linting runs in a separate process. `knownVariables` resolves references like `{userRole}`, `knownFunctions` prevents custom function calls from being reported as unknown, and `components` lets the linter resolve paths into specialized questions.

```javascript
const result = lintSurvey(surveyJson, {
  knownVariables: ["userRole", "tenant.plan"],
  knownFunctions: ["scoreSection"],
  components: {
    fullname: {
      elementsJSON: [
        { type: "text", name: "firstName" },
        { type: "text", name: "lastName" }
      ]
    }
  }
});
```

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

### Start and stop the timer with Survey.startTimer() and stopTimer()

Source: https://surveyjs.io/form-library/documentation/design-survey/create-a-quiz

Use these methods to suspend and resume the timer programmatically. The timer starts when a user begins the quiz.

```javascript
const surveyJson = { ... };
const survey = new Survey.Model(surveyJson);

survey.startTimer();
survey.stopTimer();
```

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

### uploadFiles method

Source: https://surveyjs.io/form-library/documentation/api-reference/survey-data-model

Uploads files to a server. Accepts a File Upload or Signature Pad question instance, the question name, an array of File objects, and a callback function to handle the upload result.

```APIDOC
## uploadFiles method

### Description
Uploads files to a server. The following code shows how to call this method:
```
const question = survey.getQuestionByName("myFileQuestion");
survey.uploadFiles(
  question,
  question.name,
  question.value,
  (data, errors) => {
    // ...
  }
);
```

### Method
`uploadFiles(question, name, files, callback, sourceType?)`

### Signature
`(question: QuestionFileModel | QuestionSignaturePadModel, name: string, files: File[], callback: (data: any, errors?: any) => any, sourceType?: string) => void`

### Parameters
- **question** (QuestionFileModel | QuestionSignaturePadModel) - Required - A File Upload question instance or Signature Pad question instance.
- **name** (string) - Required - The File Upload question's `name` or Signature Pad question's `name`.
- **files** (File[]) - Required - An array of JavaScript File objects that represent files to upload.
- **callback** ((data: any, errors?: any) => any) - Required - A callback function that allows you to access successfully uploaded files as the first argument. If any files fail to upload, the second argument contains an array of error messages.
- **sourceType** (string) - Optional - The source type.

### Returns
void

### Implemented in
SurveyModel

### See also
- `onUploadFiles`
- `downloadFile`
```

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

### QuestionFileModelBase Methods

Source: https://surveyjs.io/form-library/documentation/api-reference/file-model?id=QuestionFileModelBase

Methods to expand the survey element and move focus to the input field.

```APIDOC
## QuestionFileModelBase Methods

### expand

#### Description
Expands the survey element.

#### Method
`expand()`

#### Parameters
None.

#### Returns
`void`

#### Implemented in
SurveyElement

#### See Also
- `state`
- `toggleState`
- `collapse`
- `isCollapsed`
- `isExpanded`

### focus

#### Description
Moves focus to the input field of this question.

#### Method
`focus(onError?: boolean, scrollIfVisible?: boolean)`

#### Parameters
- **onError** (boolean) - Optional - If `true`, focus is moved to the first error input.
- **scrollIfVisible** (boolean) - Optional - If `true`, the page scrolls to make the input visible.

#### Returns
`void`

#### Implemented in
SurveyElement
```

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

### min expression example

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Returns the minimum of passed numbers. Example: "expression": "min({total1}, {total2})".

```json
"expression": "min({total1}, {total2})"
```

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

### max expression example

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Returns the maximum of passed numbers. Example: "expression": "max({total1}, {total2})".

```json
"expression": "max({total1}, {total2})"
```

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

### avg expression example

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Returns the average of passed numbers. Example: "expression": "avg({total1}, {total2}, {total3})".

```json
"expression": "avg({total1}, {total2}, {total3})"
```

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

### QuestionMatrixDropdownModelBase Methods

Source: https://surveyjs.io/form-library/documentation/api-reference/questionmatrixdropdownmodelbase?id=Question

Lists the methods available on the QuestionMatrixDropdownModelBase class, including their signatures and descriptions.

```APIDOC
## QuestionMatrixDropdownModelBase Methods

### calcMinWidth
- **Signature**: `() => string`
- **Description**: Returns the minWidth CSS value for an element that overrides the default min-width. It is scaled the same way as the theme's default.
- **Implemented in**: SurveyElement

### clearErrors
- **Signature**: `() => void`
- **Description**: Clears all errors for the question.

### clearIncorrectValues
- **Signature**: `() => void`
- **Description**: Clears incorrect values.

### clearValue
- **Signature**: `() => void`
- **Description**: Clears the question value.

### clone
- **Signature**: `() => Question`
- **Description**: Creates a clone of the question.

### collapse
- **Signature**: `() => void`
- **Description**: Collapses the question.

### expand
- **Signature**: `() => void`
- **Description**: Expands the question.

### focus
- **Signature**: `() => void`
- **Description**: Focuses the question.

### fromJSON
- **Signature**: `(json: any) => void`
- **Description**: Loads the question from a JSON object.

### getColumnByName
- **Signature**: `(name: string) => Column`
- **Description**: Returns a matrix column by its name.

### getCorrectAnswerValue
- **Signature**: `() => any`
- **Description**: Returns the correct answer value.

### getDisplayValue
- **Signature**: `() => any`
- **Description**: Returns the display value.

### getLocale
- **Signature**: `() => string`
- **Description**: Returns the current locale.

### getLocalizationJSON
- **Signature**: `() => any`
- **Description**: Returns the localization JSON.

### getNestedQuestions
- **Signature**: `() => Question[]`
- **Description**: Returns nested questions.

### getOwner
- **Signature**: `() => Base`
- **Description**: Returns the owner of the question.

### getPlainData
- **Signature**: `() => any`
- **Description**: Returns plain data.

### getPropertyByName
- **Signature**: `(name: string) => any`
- **Description**: Returns a property value by name.

### getPropertyValue
- **Signature**: `(name: string) => any`
- **Description**: Returns a property value by name.

### getRowValue
- **Signature**: `(row: MatrixRow) => any`
- **Description**: Returns the value of a matrix row.

### getTitleLocation
- **Signature**: `() => string`
- **Description**: Returns the title location.

### getType
- **Signature**: `() => string`
- **Description**: Returns the question type.

### getValueType
- **Signature**: `() => string`
- **Description**: Returns the value type.

### isAnswerCorrect
- **Signature**: `() => boolean`
- **Description**: Indicates whether the answer is correct.

### isDescendantOf
- **Signature**: `(element: Base) => boolean`
- **Description**: Indicates whether the question is a descendant of the given element.

### isEmpty
- **Signature**: `() => boolean`
- **Description**: Indicates whether the question value is empty.

### isSelectQuestion
- **Signature**: `() => boolean`
- **Description**: Indicates whether the question is a select question.

### isValueEmpty
- **Signature**: `(value: any) => boolean`
- **Description**: Indicates whether the given value is empty.

### registerPropertyChangedHandlers
- **Signature**: `(propertyName: string, handler: (newValue: any, oldValue: any) => void) => void`
- **Description**: Registers a handler for property changes.

### setPropertyValue
- **Signature**: `(name: string, value: any) => void`
- **Description**: Sets a property value.

### setRowValue
- **Signature**: `(row: MatrixRow, value: any) => void`
- **Description**: Sets the value of a matrix row.

### toJSON
- **Signature**: `() => any`
- **Description**: Serializes the question to JSON.

### toggleState
- **Signature**: `() => void`
- **Description**: Toggles the question state (collapsed/expanded).

### unregisterPropertyChangedHandlers
- **Signature**: `(propertyName: string, handler: (newValue: any, oldValue: any) => void) => void`
- **Description**: Unregisters a property change handler.

### validate
- **Signature**: `() => void`
- **Description**: Validates the question.

### validateExpressions
- **Signature**: `() => void`
- **Description**: Validates expressions.
```

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

### getDate expression example

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Converts a question's value to a Date object. Example: "expression": "getDate({birthdate})".

```json
"expression": "getDate({birthdate})"
```

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

### Question Class Overview

Source: https://surveyjs.io/form-library/documentation/api-reference/question?id=Base

A summary of the Question base class, its inheritance, and the list of properties, methods, and events it provides.

```APIDOC
# Question

A base class for all questions.

Inherited from the following class(es):
- SurveyElement
- SurveyElementCore
- Base

## Properties

- clearIfInvisible
- colSpan
- comment
- commentPlaceholder
- commentText
- containsErrors
- correctAnswer
- cssClasses
- defaultDisplayValue
- defaultValue
- defaultValueExpression
- description
- descriptionLocation
- enableIf
- errorLocation
- errors
- gridColumnsWidth
- hasDefaultMinWidth
- hasDescription
- hasInput
- hasMinWidth
- hasSingleInput
- hasTitle
- inSurvey
- indent
- isAllowTitleLeft
- isCollapsed
- isDesignMode
- isExpanded
- isInGridColumn
- isLoadingFromJson
- isPage
- isPanel
- isParentVisible
- isQuestion
- isReadOnly
- isRequired
- isSurvey
- isVisible
- maxWidth
- minWidth
- name
- no
- page
- parent
- parentQuestion
- questionName
- quizQuestionCount
- readOnly
- renderWidth
- requiredErrorText
- requiredIf
- requiredMark
- resetValueIf
- setValueExpression
- setValueIf
- showCommentArea
- showNumber
- startWithNewLine
- state
- survey
- title
- titleLocation
- useDisplayValuesInDynamicTexts
- validators
- value
- valueName
- visible
- visibleIf
- visibleIndex
- width

## Methods

- calcMinWidth
- clearErrors
- clearIncorrectValues
- clearValue
- clone
- collapse
- expand
- focus
- fromJSON
- getCorrectAnswerValue
- getDisplayValue
- getLocale
- getLocalizationJSON
- getNestedQuestions
- getOwner
- getPlainData
- getPropertyByName
- getPropertyValue
- getTitleLocation
- getType
- getValueType
- isAnswerCorrect
- isDescendantOf
- isEmpty
- isSelectQuestion
- isValueEmpty
- registerPropertyChangedHandlers
- setPropertyValue
- toJSON
- toggleState
- unregisterPropertyChangedHandlers
- validate
- validateExpressions

## Events

- onItemValuePropertyChanged
- onPropertyChanged
- onReadyChanged
```

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

### settings.showDialog

Source: https://surveyjs.io/form-library/documentation/api-reference/settings

A method that displays a modal dialog. Configure the dialog's content and behavior using the options parameter.

```APIDOC
## settings.showDialog

### Description
A method that displays a modal dialog. Configure the dialog's content and behavior using the options parameter.

### Type
`(options: IDialogOptions, rootElement?: HTMLElement) => any` **writable**

### Parameters
- **options** (`IDialogOptions`) - Required - An object that configures the dialog's content and behavior.
- **rootElement** (`HTMLElement`) - Optional - A DOM element where the dialog should be rendered. If not specified, the dialog is rendered into `document.body`.

### Implemented in
`settings`
```

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

### Properties

Source: https://surveyjs.io/form-library/documentation/api-reference/questionpaneldynamicmodel

Documentation for properties of QuestionPanelDynamicModel and its base classes.

```APIDOC
## Properties

### displayMode
- **Type**: string
- **Writable**: Yes
- **Implemented in**: QuestionPanelDynamicModel
- **Accepted values**: `default`, `collapsed`, `expanded`, `firstExpanded`
- **See also**: `displayMode *`, `templateTitle`

### parent
- **Type**: IPanel
- **Writable**: Yes
- **Implemented in**: Question
- **Description**: Returns a survey element (panel or page) that contains the question and allows you to move this question to a different survey element.

### parentQuestion
- **Type**: E
- **Readonly**: Yes
- **Implemented in**: SurveyElement
- **Description**: A Dynamic Panel, Dynamic Matrix, or Dropdown Matrix that includes the current question. This property is `null` for standalone questions.

### prevPanelText
- **Type**: string
- **Writable**: Yes
- **Implemented in**: QuestionPanelDynamicModel
- **Available since**: v2.0.0
- **Description**: A caption for the Previous button. Applies only if `displayMode` is different from `"list"`.
- **See also**: `displayMode *`, `isPrevButtonVisible *`

### progressBarLocation
- **Type**: "top" | "bottom" | "topBottom"
- **Readonly**: Yes
- **Implemented in**: QuestionPanelDynamicModel
- **Default value**: `top`
- **Accepted values**: `top`, `bottom`, `topBottom`
- **Description**: Specifies the alignment of the progress bar relative to the currently displayed panel. Applies only if `displayMode` is `"carousel"`.

### questionName
- **Type**: string
- **Readonly**: Yes
- **Implemented in**: Question
- **Description**: A unique value for the `name` HTML attribute of grouped inputs (e.g. radio buttons), so that questions sharing the same `name` (such as copies inside a Dynamic Panel) do not collapse into one input group.

### questionStartIndex
- **Type**: string
- **Writable**: Yes
- **Implemented in**: QuestionPanelDynamicModel
- **Default value**: `"1."` (inherited from the `questionStartIndex` property specified for the parent panel, page, or survey)
- **Description**: Specifies a number or letter used to start numbering of elements inside the dynamic panel. You can include desired prefixes and postfixes alongside the number or letter.
- **See also**: `showQuestionNumbers`

### quizQuestionCount
- **Type**: number
- **Readonly**: Yes
- **Implemented in**: Question
- **Description**: The number of quiz questions. A question counts if it is visible, has an input field, and specifies `correctAnswer`.
- **See also**: Create a Quiz, `correctAnswer *`, `SurveyModel.getQuizQuestions`

### readOnly
- **Type**: boolean
- **Writable**: Yes
- **Implemented in**: SurveyElement
- **Description**: Makes the survey element read-only. If you want to switch a survey element to the read-only state based on a condition, specify the `enableIf` property.
- **See also**: `isReadOnly`
```

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

### Clone the collaborative-form-filling repository

Source: https://surveyjs.io/form-library/documentation/multi-user-form-filling

Clone the repository and change into the project directory.

```bash
git clone https://github.com/surveyjs/collaborative-form-filling.git
cd collaborative-form-filling
```

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

### currentDate function example

Source: https://surveyjs.io/form-library/documentation/design-survey/conditional-logic

Returns the current date and time.

```json
"expression": "currentDate()"
```