DevExtreme jQuery Components

https://js.devexpress.com/jQuery/Documentation/25_2/
Admin
The DevExtreme jQuery UI Component Suite offers over 80 responsive, touch-enabled UI components,...
Tokens:49,093,508
Snippets:306,835
Trust Score:10
Update:1 year ago
Show doc for...
Tokens:
Raw
### Guide: Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Configuration/title/margin

This section provides instructions and examples on how to get started with DevExtreme components using jQuery.

```APIDOC
## Guide: Getting Started

### Description
This section provides instructions and examples on how to get started with DevExtreme components using jQuery.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
- HTML content for the Getting Started guide.

#### Response Example
None
```

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

### FileManager - Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxFileManager/File_System_Providers

Guide on getting started with the dxFileManager component.

```APIDOC
## FileManager - Getting Started

### Description
This guide provides instructions on how to get started with the dxFileManager component.

### Method
N/A (Documentation Guide)

### Endpoint
/jQuery/Documentation/25_2/Guide/UI_Components/FileManager/Getting_Started_with_File_Manager/

### Parameters
N/A

### Request Example
N/A

### Response
N/A

```

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

### Getting Started with dxMenu

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxMenu/Types/OptionChangedEvent

Learn how to get started with the dxMenu UI component, including basic setup and usage examples.

```APIDOC
## GET /jQuery/Documentation/25_2/Guide/UI_Components/Menu/Getting_Started_with_Menu/

### Description
This section provides a guide to getting started with the dxMenu UI component for jQuery. It includes essential information for initial setup and basic implementation.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/UI_Components/Menu/Getting_Started_with_Menu/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
- **Guide Content** (html) - The HTML content of the dxMenu getting started guide.

#### Response Example
(HTML content of the getting started guide)
```

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

### Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxValidator/Types/InitializedEvent

Provides an introduction and initial setup guide for using DevExtreme with jQuery.

```APIDOC
## Getting Started Guide

### Description
This section guides you through the initial steps of integrating and using DevExtreme components with your jQuery projects.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
HTML content of the Getting Started guide.

#### Response Example
HTML structure of the guide page.
```

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

### Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxAutocomplete/Types/FocusOutEvent

Provides an introduction and initial setup guide for DevExtreme with jQuery.

```APIDOC
## Getting Started

### Description
This section provides an overview and setup instructions for using DevExtreme components with jQuery.

### Method
N/A (Documentation Link)

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
N/A
```

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

### FileManager - Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxFileManager/File_System_Providers/Object/Configuration

Guide on how to get started with the dxFileManager component in DevExtreme jQuery.

```APIDOC
## FileManager - Getting Started

### Description
This guide provides instructions on how to integrate and use the dxFileManager component.

### Method
N/A (Documentation Link)

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
N/A
```

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

### jQuery/JavaScript Calendar - Getting Started Guide (HTML/JavaScript)

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/Calendar/Handle_the_Value_Change_Event

This section provides a getting started guide for the DevExtreme JavaScript/jQuery Calendar component. It assumes DevExtreme is already installed in the application. The content is presented within a documentation structure, including headers and notes.

```htmljavascript
<div class="doc-content">
        <div class="documentationSection shiftedHeaders curr-light">
            <a class="anchor article-without-gray-line"></a>

            <h1 class="article-header">
                        <a class="visible-anchor" href="/jQuery/Documentation/25_2/Guide/UI_Components/Calendar/Getting_Started_with_Calendar/">
            <svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
                <circle cx="14" cy="14" r="14" fill="#2190F7" />
                <path d="M12.7796 15.2204C13.1344 15.558 13.1344 16.112 12.7796 16.4496C12.442 16.7871 11.888 16.7871 11.5504 16.4496C9.86259 14.7617 9.86259 12.0179 11.5504 10.33L14.6146 7.26589C16.3024 5.57804 19.0463 5.57804 20.7341 7.26589C22.422 8.95375 22.422 11.6976 20.7341 13.3854L19.4444 14.6751C19.4531 13.9654 19.3405 13.2556 19.0982 12.5805L19.505 12.165C20.5264 11.1523 20.5264 9.50771 19.505 8.495C18.4923 7.47363 16.8477 7.47363 15.835 8.495L12.7796 11.5504C11.7582 12.5632 11.7582 14.2077 12.7796 15.2204ZM15.2204 11.5504C15.558 11.2129 16.112 11.2129 16.4496 11.5504C18.1374 13.2383 18.1374 15.9821 16.4496 17.67L13.3854 20.7341C11.6976 22.422 8.95375 22.422 7.26589 20.7341C5.57804 19.0463 5.57804 16.3024 7.26589 14.6146L8.55559 13.3249C8.54693 14.0346 8.65945 14.7444 8.90181 15.4282L8.495 15.835C7.47363 16.8477 7.47363 18.4923 8.495 19.505C9.50771 20.5264 11.1523 20.5264 12.165 19.505L15.2204 16.4496C16.2418 15.4368 16.2418 13.7923 15.2204 12.7796C14.8656 12.442 14.8656 11.888 15.2204 11.5504Z" fill="white" />
            </svg>
        </a>

                JavaScript/jQuery Calendar - Getting Started

                </h1>

                <div class="full-description-offset">
                    <div class="accordion-hidden-content"><h5>jQuery</h5>

<div class="note"><div class="note-header">NOTE</div> <div class="note-text"> Before you start the tutorial, ensure DevExtreme is <a href="/jQuery/Documentation/25_2/Guide/jQuery_Components/Add_DevExtreme_to_a_jQuery_Application/">installed in your application</a>.</div></div>

<h5>Angular</h5>
```

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

### DevExpress JavaScript/jQuery FileManager Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/FileManager/Getting_Started_with_File_Manager

This snippet outlines the structure for documenting the getting started guide for the DevExpress JavaScript/jQuery FileManager component. It includes a title, a link to the detailed guide, and the version information.

```html
<div class="doc-content">
        <div class="documentationSection shiftedHeaders curr-light">
            <a class="anchor article-without-gray-line"></a>

            <h1 class="article-header">
                        <a class="visible-anchor" href="/jQuery/Documentation/25_2/Guide/UI_Components/FileManager/Getting_Started_with_File_Manager/">
            <svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
                <circle cx="14" cy="14" r="14" fill="#2190F7" />
                <path d="M12.7796 15.2204C13.1344 15.558 13.1344 16.112 12.7796 16.4496C12.442 16.7871 11.888 16.7871 11.5504 16.4496C9.86259 14.7617 9.86259 12.0179 11.5504 10.33L14.6146 7.26589C16.3024 5.57804 19.0463 5.57804 20.7341 7.26589C22.422 8.95375 22.422 11.6976 20.7341 13.3854L19.4444 14.6751C19.4531 13.9654 19.3405 13.2556 19.0982 12.5805L19.505 12.165C20.5264 11.1523 20.5264 9.50771 19.505 8.495C18.4923 7.47363 16.8477 7.47363 15.835 8.495L12.7796 11.5504C11.7582 12.5632 11.7582 14.2077 12.7796 15.2204ZM15.2204 11.5504C15.558 11.2129 16.112 11.2129 16.4496 11.5504C18.1374 13.2383 18.1374 15.9821 16.4496 17.67L13.3854 20.7341C11.6976 22.422 8.95375 22.422 7.26589 20.7341C5.57804 19.0463 5.57804 16.3024 7.26589 14.6146L8.55559 13.3249C8.54693 14.0346 8.65945 14.7444 8.90181 15.4282L8.495 15.835C7.47363 16.8477 7.47363 18.4923 8.495 19.505C9.50771 20.5264 11.1523 20.5264 12.165 19.505L15.2204 16.4496C16.2418 15.4368 16.2418 13.7923 15.2204 12.7796C14.8656 12.442 14.8656 11.888 15.2204 11.5504Z" fill="white" />
            </svg>
        </a>

                JavaScript/jQuery FileManager - Getting Started

                </h1>
```

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

### dxDiagram - Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxDiagram/Configuration/contextToolbox

Guide on how to get started with the dxDiagram component.

```APIDOC
## dxDiagram Getting Started

### Description
This guide provides instructions on how to begin using the dxDiagram component.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/UI_Components/Diagram/Getting_Started_with_Diagram/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
Getting started documentation for dxDiagram.

#### Response Example
None
```

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

### Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxValidator/Configuration/adapter

Learn how to get started with DevExtreme's jQuery components.

```APIDOC
## GET /jQuery/Documentation/25_2/Guide/Getting Started/

### Description
Provides an overview and initial setup instructions for using DevExtreme components with jQuery.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
- HTML content for the Getting Started guide.

#### Response Example
None
```

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

### Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxActionSheet/Types/ItemHoldEvent

Provides initial steps and guidance for getting started with the JavaScript UI components.

```APIDOC
## Getting Started

### Description
This section provides instructions and best practices for getting started with the JavaScript UI components.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
- Documentation content for getting started.

#### Response Example
```html
<!-- HTML content of the getting started guide -->
```
```

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

### Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Configuration/legend

Provides introductory information and guides to help you begin using DevExtreme components.

```APIDOC
## Getting Started

### Description

This section provides introductory information and guides to help you begin using DevExtreme components.

### Method

N/A

### Endpoint

N/A

### Parameters

N/A

### Request Example

N/A

### Response

N/A
```

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

### Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Configuration/tooltip

This section provides an introduction to using DevExtreme components with jQuery.

```APIDOC
## Getting Started

### Description

This guide covers the initial steps to integrate and start using DevExtreme UI components within your jQuery projects.

### Method

N/A (Documentation Page)

### Endpoint

N/A (Documentation Page)

### Parameters

N/A

### Request Example

N/A

### Response

N/A

```

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

### Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxAccordion/Types/ItemRenderedEvent

Provides introductory information and setup instructions for using DevExtreme jQuery widgets.

```APIDOC
## Getting Started

### Description
Provides introductory information and setup instructions for using DevExtreme jQuery widgets.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting_Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
HTML content of the Getting Started guide.

#### Response Example
None
```

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

### Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Configuration/tooltip/border

This section provides an introduction and guide to getting started with DevExtreme jQuery components.

```APIDOC
## GET /jQuery/Documentation/25_2/Guide/Getting Started/

### Description
Provides instructions and guidance for initiating development with DevExtreme's jQuery components.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting Started/

### Parameters

None

### Request Example

None

### Response

#### Success Response (200)

HTML content of the Getting Started guide.

#### Response Example

```html
<!DOCTYPE html>
<html>
<head>
    <title>Getting Started</title>
</head>
<body>
    <h1>Getting Started with DevExtreme jQuery</h1>
    <p>...</p>
</body>
</html>
```
```

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

### Diagram Component Setup

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/Diagram/Restrict_Edit_Operations

Example of setting up the DevExtreme React Diagram component with nodes, using an ArrayStore for data.

```APIDOC
## POST /api/diagram/nodes

### Description
This endpoint is used to configure and display nodes within the DevExtreme Diagram component. It utilizes an ArrayStore to manage the data for the nodes, specifying key expressions for item identification and relationships.

### Method
POST

### Endpoint
/api/diagram/nodes

### Parameters
#### Request Body
- **nodes** (Array<Object>) - Required - An array of node objects, each containing properties like ID, Parent_ID, Task_Name, and Description.

### Request Example
```json
{
  "nodes": [
    {
      "ID": 1,
      "Task_Name": "Project Planning",
      "Description": "Define project scope and goals"
    },
    {
      "ID": 2,
      "Parent_ID": 1,
      "Task_Name": "Requirement Analysis",
      "Description": "Gather and document requirements"
    }
  ]
}
```

### Response
#### Success Response (200)
- **status** (string) - Indicates the success of the operation.
- **message** (string) - A confirmation message.

#### Response Example
```json
{
  "status": "success",
  "message": "Nodes configured successfully."
}
```
```

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

### Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Types/IncidentOccurredEvent

This section provides introductory information and guides to help you begin using DevExtreme with jQuery.

```APIDOC
## Getting Started

### Description
Provides introductory information and guides to help you begin using DevExtreme with jQuery.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
- HTML content with getting started information.

#### Response Example
None
```

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

### dxDiagram Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxDiagram/Types/RequestLayoutUpdateEvent

Guide for getting started with the dxDiagram component using jQuery.

```APIDOC
## dxDiagram Getting Started

### Description
Guide for getting started with the dxDiagram component.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/UI_Components/Diagram/Getting_Started_with_Diagram/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
Getting started guide for dxDiagram.

#### Response Example
None
```

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

### dxAccordion - Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxAccordion/Types/ItemRenderedEvent

Guide to getting started with the dxAccordion UI component in DevExtreme jQuery.

```APIDOC
## dxAccordion - Getting Started

### Description
Guide to getting started with the dxAccordion UI component in DevExtreme jQuery.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/UI_Components/Accordion/Getting_Started_with_Accordion/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
HTML content of the dxAccordion Getting Started guide.

#### Response Example
None
```

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

### Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Configuration/tooltip/shadow

Provides initial setup and guidance for using DevExtreme jQuery components.

```APIDOC
## Getting Started

### Description
Provides initial setup and guidance for using DevExtreme jQuery components.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting_Started/
```

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

### DateRangeBox Getting Started Guide (JavaScript/jQuery)

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/DateRangeBox/Accessibility

This snippet is a placeholder for the 'Getting Started' guide for the DateRangeBox component in DevExpress JavaScript/jQuery version 25.2. It indicates the start of documentation for this specific UI component.

```javascript
<h1 class="article-header">
            <a class="visible-anchor" href="/jQuery/Documentation/25_2/Guide/UI_Components/DateRangeBox/Getting_Started_with_DateRangeBox/">
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
    <circle cx="14" cy="14" r="14" fill="#2190F7" />
    <path d="M12.7796 15.2204C13.1344 15.558 13.1344 16.112 12.7796 16.4496C12.442 16.7871 11.888 16.7871 11.5504 16.4496C9.86259 14.7617 9.86259 12.0179 11.5504 10.33L14.6146 7.26589C16.3024 5.57804 19.0463 5.57804 20.7341 7.26589C22.422 8.95375 22.422 11.6976 20.7341 13.3854L19.4444 14.6751C19.4531 13.9654 19.3405 13.2556 19.0982 12.5805L19.505 12.165C20.5264 11.1523 20.5264 9.50771 19.505 8.495C18.4923 7.47363 16.8477 7.47363 15.835 8.495L12.7796 11.5504C11.7582 12.5632 11.7582 14.2077 12.7796 15.2204ZM15.2204 11.5504C15.558 11.2129 16.112 11.2129 16.4496 11.5504C18.1374 13.2383 18.1374 15.9821 16.4496 17.67L13.3854 20.7341C11.6976 22.422 8.95375 22.422 7.26589 20.7341C5.57804 19.0463 5.57804 16.3024 7.26589 14.6146L8.55559 13.3249C8.54693 14.0346 8.65945 14.7444 8.90181 15.4282L8.495 15.835C7.47363 16.8477 7.47363 18.4923 8.495 19.505C9.50771 20.5264 11.1523 20.5264 12.165 19.505L15.2204 16.4496C16.2418 15.4368 16.2418 13.7923 15.2204 12.7796C14.8656 12.442 14.8656 11.888 15.2204 11.5504Z" fill="white" />
</svg>
            </a>

                JavaScript/jQuery DateRangeBox - Getting Started

                </h1>

                <div class="full-description-offset">

```

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

### Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Configuration/title/subtitle

Learn how to get started with DevExtreme for jQuery.

```APIDOC
## GET /websites/js_devexpress_jquery_25_2/Guide/Getting Started/

### Description
Provides an overview and initial steps for using DevExtreme with jQuery.

### Method
GET

### Endpoint
/websites/js_devexpress_jquery_25_2/Guide/Getting Started/
```

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

### UI Components - Autocomplete - Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxAutocomplete/Types/FocusOutEvent

Guide to getting started with the dxAutocomplete UI component.

```APIDOC
## dxAutocomplete Getting Started

### Description
This guide helps you get started with implementing and configuring the dxAutocomplete UI component.

### Method
N/A (Documentation Link)

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
N/A
```

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

### Getting Started with JavaScript/jQuery Calendar

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/Calendar/Demos

This section details how to get started with the DevExtreme Calendar component in a jQuery application. It highlights the prerequisite of having DevExtreme installed in the project before proceeding with the tutorial.

```javascript
// Ensure DevExtreme is installed in your application before starting the tutorial.
// For example:
// <script src="path/to/dx.all.js"></script>

// Then initialize the calendar component:
// $(function() {
//     $("#calendar").dxCalendar({
//         // options
//     });
// });
```

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

### DevExtreme jQuery Component Setup

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxLinearGauge

Guides for adding DevExtreme components to different JavaScript frameworks.

```APIDOC
## Add DevExtreme to a jQuery Application

### Description
Instructions on how to integrate DevExtreme into your jQuery projects.

### Method
N/A (Informational Guide)

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
N/A
```

```APIDOC
## Add DevExtreme to an Angular CLI Application

### Description
Steps to add DevExtreme components when using Angular CLI.

### Method
N/A (Informational Guide)

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
N/A
```

```APIDOC
## Add DevExtreme to a Vue Application

### Description
Guide for incorporating DevExtreme components into Vue.js applications.

### Method
N/A (Informational Guide)

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
N/A
```

```APIDOC
## Add DevExtreme to a React Application

### Description
Instructions for adding DevExtreme components to React applications.

### Method
N/A (Informational Guide)

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
N/A
```

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

### dxDateRangeBox - Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxDateRangeBox/Events

Guide on how to get started with the dxDateRangeBox component in DevExtreme jQuery.

```APIDOC
## dxDateRangeBox - Getting Started

### Description
This guide explains how to integrate and begin using the dxDateRangeBox component.

### Method
N/A

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
N/A
```

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

### Getting Started with Floating Action Button

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxSpeedDialAction/Events

Guides on how to get started with the DevExtreme Floating Action Button component using jQuery.

```APIDOC
## Getting Started with Floating Action Button

### Description
This guide provides the initial steps for implementing and using the Floating Action Button component in your jQuery application.

### Endpoint
`/jQuery/Documentation/25_2/Guide/UI_Components/Floating_Action_Button/Getting_Started_with_Floating_Action_Button/`
```

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

### Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBullet/Types/ExportedEvent

Provides an introduction and initial steps for using DevExtreme with jQuery.

```APIDOC
## Getting Started Guide

### Description
This section provides an introduction and initial steps for using DevExtreme with jQuery.

### Method
N/A

### Endpoint
N/A

### Parameters
None

### Request Example
None

### Response
N/A
```

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

### Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBullet/Types/FileSavingEvent

Documentation for getting started with DevExtreme jQuery.

```APIDOC
## GET /websites/js_devexpress_jquery_25_2/Guide/Getting Started/

### Description
Provides a guide for getting started with DevExtreme jQuery.

### Method
GET

### Endpoint
/websites/js_devexpress_jquery_25_2/Guide/Getting Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
Content of the Getting Started guide.

#### Response Example
None
```

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

### Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxActionSheet/Types/CancelClickEvent

Navigate to the Getting Started guide for DevExtreme jQuery components.

```APIDOC
## GET /websites/js_devexpress_jquery_25_2/Guide/Getting Started/

### Description
This section provides instructions and guidance on how to start using DevExtreme jQuery UI components.

### Method
GET

### Endpoint
/websites/js_devexpress_jquery_25_2/Guide/Getting Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
- HTML content of the Getting Started guide.

#### Response Example
None
```

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

### Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Configuration/tooltip/font

Provides an introduction to using DevExtreme widgets with jQuery and initial setup instructions.

```APIDOC
## Getting Started

### Description
Provides an introduction to using DevExtreme widgets with jQuery and initial setup instructions.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting Started/

### Parameters
None
```

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

### Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Configuration/legend/title/subtitle/font

Provides instructions on how to begin using DevExtreme components with jQuery.

```APIDOC
## GET /websites/js_devexpress_jquery_25_2/Guide/Getting Started/

### Description
Navigate to the Getting Started section for DevExtreme jQuery.

### Method
GET

### Endpoint
/websites/js_devexpress_jquery_25_2/Guide/Getting Started/
```

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

### UI Components - dxDataGrid - Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxDataGrid/Types/Editing

Getting started guide for the dxDataGrid component.

```APIDOC
## dxDataGrid - Getting Started

### Description
Guides users on how to get started with the dxDataGrid component.

### Method
N/A

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
N/A
```

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

### Start Tutorial Button

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxTextBox/Events

This HTML snippet generates a 'Start Tutorial' button. It is styled with DevExtreme's orange color and a fixed width. The button links to the getting started guide for the dxTextBox widget, opening in a new tab.

```html
<a href="/jQuery/Documentation/25_2/Guide/UI_Components/TextBox/Getting_Started_with_TextBox/" class="button orange small fix-width-155" style="margin-right: 5px;" target="_blank">Start Tutorial</a>
```

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

### Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxAccordion/Types/OptionChangedEvent

Provides instructions and guidance on how to start using DevExtreme components with jQuery.

```APIDOC
## GET /jQuery/Documentation/25_2/Guide/Getting Started/

### Description
This endpoint provides the main guide for getting started with DevExtreme using jQuery.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
HTML content of the Getting Started guide.

#### Response Example
```html
<!DOCTYPE html>
<html>
<head>
    <title>Getting Started with DevExtreme jQuery</title>
</head>
<body>
    <h1>DevExtreme jQuery Getting Started</h1>
    <p>...</p>
</body>
</html>
```
```

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

### Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Configuration/label

Provides an introduction and initial steps for using js_devexpress_jquery_25_2.

```APIDOC
## Getting Started

### Description
Guides users through the initial setup and usage of the js_devexpress_jquery_25_2 library.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting_Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
- Documentation content for Getting Started.

#### Response Example
None
```

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

### DevExtreme PieChart Guide - Getting Started with jQuery

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/PieChart/Overview

This section outlines the initial setup for using the DevExtreme PieChart component with jQuery. It emphasizes the necessity of having DevExtreme installed in the application before proceeding with the tutorial.

```html
<div class="doc-content">
        <div class="documentationSection shiftedHeaders curr-light">
            <a class="anchor article-without-gray-line"></a>

            <h1 class="article-header">
                        <a class="visible-anchor" href="/jQuery/Documentation/25_2/Guide/UI_Components/PieChart/Getting_Started_with_PieChart/">
            <svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
                <circle cx="14" cy="14" r="14" fill="#2190F7" />
                <path d="M12.7796 15.2204C13.1344 15.558 13.1344 16.112 12.7796 16.4496C12.442 16.7871 11.888 16.7871 11.5504 16.4496C9.86259 14.7617 9.86259 12.0179 11.5504 10.33L14.6146 7.26589C16.3024 5.57804 19.0463 5.57804 20.7341 7.26589C22.422 8.95375 22.422 11.6976 20.7341 13.3854L19.4444 14.6751C19.4531 13.9654 19.3405 13.2556 19.0982 12.5805L19.505 12.165C20.5264 11.1523 20.5264 9.50771 19.505 8.495C18.4923 7.47363 16.8477 7.47363 15.835 8.495L12.7796 11.5504C11.7582 12.5632 11.7582 14.2077 12.7796 15.2204ZM15.2204 11.5504C15.558 11.2129 16.112 11.2129 16.4496 11.5504C18.1374 13.2383 18.1374 15.9821 16.4496 17.67L13.3854 20.7341C11.6976 22.422 8.95375 22.422 7.26589 20.7341C5.57804 19.0463 5.57804 16.3024 7.26589 14.6146L8.55559 13.3249C8.54693 14.0346 8.65945 14.7444 8.90181 15.4282L8.495 15.835C7.47363 16.8477 7.47363 18.4923 8.495 19.505C9.50771 20.5264 11.1523 20.5264 12.165 19.505L15.2204 16.4496C16.2418 15.4368 16.2418 13.7923 15.2204 12.7796C14.8656 12.442 14.8656 11.888 15.2204 11.5504Z" fill="white" />
            </svg>
        </a>

                JavaScript/jQuery PieChart - Getting Started

                </h1>

                <div class="full-description-offset">
                    <div class="accordion-hidden-content"><h5>jQuery</h5>

<div class="note"><div class="note-header">NOTE</div> <div class="note-text"> Before you start the tutorial, ensure DevExtreme is <a href="/jQuery/Documentation/25_2/Guide/jQuery_Components/Add_DevExtreme_to_a_jQuery_Application/">installed in your application</a>.</div></div>
```

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

### TagBox API

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxGantt

Documentation for the TagBox UI component. Includes getting started guides and related component information.

```APIDOC
## TagBox UI Component

### Description
Documentation for the TagBox UI component, including getting started guides and related links.

### Method
N/A

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
#### Success Response (200)
N/A

#### Response Example
N/A
```

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

### Stepper Component API

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/Markup_Components

Provides an overview and getting started guide for the Stepper UI component.

```APIDOC
## Stepper Component API

### Description

Documentation for the Stepper UI component, including a demo and getting started tutorial.

### Method

N/A (This is documentation, not an API endpoint)

### Endpoint

N/A

### Parameters

N/A

### Request Example

N/A

### Response

N/A
```

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

### Toast Component GitHub Repository Link

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/Toast/Getting_Started_with_Toast

Provides a link to the GitHub repository containing the full code for the DevExtreme Toast getting started example. This allows users to access and download the complete project.

```html
<p>Each section in this tutorial describes a single configuration step. You can also find the full code in the following GitHub repository: <a href="https://github.com/DevExpress-Examples/getting-started-with-devextreme-toast" target="_blank">getting-started-with-toast</a>.</p>
```

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

### NumberBox Component Setup

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/NumberBox/Getting_Started_with_NumberBox

Provides code examples for setting up the DevExtreme NumberBox component in different JavaScript frameworks.

```APIDOC
## DevExtreme NumberBox Setup

### Description
Code snippets for integrating the DevExtreme NumberBox component into popular JavaScript frameworks like Angular, Vue, and React.

### Frameworks

#### Angular
```html
<dx-number-box
    [value]="261991"
    [min]="0"
    [max]="1000000"
    format="$ #,##0.##"
>
</dx-number-box>
```

#### Vue
```html
<template>
    <DxNumberBox
        :value="261991"
    >
    </DxNumberBox>
</template>

<script>
import "devextreme/dist/css/dx.light.css";
import { DxNumberBox } from "devextreme-vue/number-box";

export default {
    components: {
        DxNumberBox
    }
}
</script>
```

#### React
```javascript
import React from "react";
import "devextreme/dist/css/dx.light.css";
import { NumberBox } from "devextreme-react/number-box";

function App() {
    return (
        <NumberBox>
        </NumberBox>
    );
}

export default App;
```
```

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

### App.js - Diagram Configuration

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/Diagram/Restrict_Operations

Example of setting up the DevExtreme Diagram component in a React application, including data source configuration.

```APIDOC
## GET /websites/js_devexpress_jquery_25_2

### Description
This snippet demonstrates the basic structure of an App.js file for a React application using the DevExtreme Diagram component. It shows how to import necessary components and data, configure the data source, and render the Diagram with its Nodes.

### Method
GET

### Endpoint
/websites/js_devexpress_jquery_25_2

### Parameters
#### Query Parameters
None

#### Request Body
None

### Request Example
```javascript
// No request body for this GET example
```

### Response
#### Success Response (200)
- **html content**: The HTML structure of the application, including the Diagram component.

### Response Example
```html
<div class="code-tabs code-wrapper"><div class="code-type active" data-index="0"><div class="code-type-text">App.js</div></div><div class="code-type" data-index="1"><div class="code-type-text">data.js</div></div><pre class="prettyprint linenums active">
import React from "react";
import Diagram, { Nodes } from "devextreme-react/diagram";
import ArrayStore from "devextreme/data/array_store";
import service from "./data.js";

const dataSource = new ArrayStore({
    key: 'ID',
    data: service.getTasks(),
});

const App = () => {
    return (
        <Diagram>
        <Nodes 
            dataSource={dataSource} 
            keyExpr="ID" 
            textExpr="Task_Name" 
            parentKeyExpr="Parent_ID"
        />
        </Diagram>
    );
};

export default App;</pre><pre class="prettyprint linenums">
const projectTasks = [
    {
        "ID": 1,
        "Task_Name": "Project Planning",
        "Description": "Define project scope and goals",
    },
    {
        "ID": 2,
        "Parent_ID": 1,
        "Task_Name": "Requirement Analysis",
        "Description": "Gather and document requirements",
    },
    {
        "ID": 3,
        "Parent_ID": 1,
        "Task_Name": "Resource Allocation",
        "Description": "Assign team and resources",
    },
    {
        "ID": 4,
        "Parent_ID": 2,
        "Task_Name": "Design Specifications",
        "Description": "Outline system design",
    },
    {
        "ID": 5,
        "Parent_ID": 3,
        "Task_Name": "Task Scheduling",
        "Description": "Develop project timeline",
    },
    {
        "ID": 6,
        "Parent_ID": 2,
        "Task_Name": "Risk Assessment",
        "Description": "Identify potential risks",
    },
    {
        "ID": 7,
        "Parent_ID": 1,
        "Task_Name": "Kick-off Meeting",
        "Description": "Launch project with stakeholders",
    }
];

export default {
    getTasks() {
        return projectTasks;
    }
}</pre></div>
```
```

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

### Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Configuration/legend/title/margin

Provides a guide on how to get started with DevExtreme jQuery widgets.

```APIDOC
## GET /jQuery/Documentation/25_2/Guide/Getting Started/

### Description
This endpoint provides the "Getting Started" guide for DevExtreme jQuery widgets.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
- HTML content of the Getting Started guide.

#### Response Example
None
```

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

### DevExtreme PieChart Guide - Getting Started with React

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/PieChart/Overview

This section guides users on how to implement the DevExtreme PieChart component in a React application. It stresses the importance of having DevExtreme installed in the React project prior to starting the tutorial.

```html
<h5>React</h5>

<div class="note"><div class="note-header">NOTE</div> <div class="note-text">
Before you start the tutorial, ensure DevExtreme is <a href="/jQuery/Documentation/25_2/Guide/React_Components/Add_DevExtreme_to_a_React_Application/">installed in your application</a>.
</div></div>
```

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

### Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/Box/Arrange_and_Align_Items

Provides instructions and guidance on how to begin using DevExtreme components with jQuery.

```APIDOC
## Getting Started

### Description
Guides users through the initial setup and usage of DevExtreme components in a jQuery project.

### Method
N/A (Documentation Link)

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
N/A
```

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

### TreeView Component Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/Data_Visualization_Widgets/dxTreeMap

Getting started with the TreeView component, including tutorials and demos.

```APIDOC
## TreeView Component

### Description

Provides a tutorial and demo for the DevExtreme jQuery TreeView component.

### Method

N/A

### Endpoint

N/A

### Parameters

N/A

### Request Example

N/A

### Response

N/A

#### Success Response (200)

N/A

#### Response Example

N/A
```

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

### Getting Started Guide

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxBarGauge/Types/ExportingEvent

The 'Getting Started' guide provides essential information for new users to begin working with DevExtreme and jQuery.

```APIDOC
## Getting Started

### Description
Provides essential information for new users to begin working with DevExtreme and jQuery.

### Method
GET

### Endpoint
/jQuery/Documentation/25_2/Guide/Getting_Started/

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
HTML content of the Getting Started guide.

#### Response Example
```html
<!-- HTML content -->
```
```

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

### React Setup

Source: https://js.devexpress.com/jQuery/Documentation/25_2/Guide/UI_Components/Calendar/Getting_Started_with_Calendar

Example of setting up the DevExtreme Calendar component in a React application.

```APIDOC
## React Setup

### Description
This snippet illustrates how to add and utilize the DevExtreme Calendar component in a React project.

### Method
N/A (Configuration)

### Endpoint
N/A

### Parameters
N/A

### Request Example
```jsx
// App.js
import React from 'react';
import 'devextreme/dist/css/dx.light.css';
import { Calendar } from 'devextreme-react/calendar';

function App() {
    return (
        <Calendar>
        </Calendar>
    );
}

export default App;
```

### Response
N/A
```

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

### dxDateRangeBox - Getting Started

Source: https://js.devexpress.com/jQuery/Documentation/25_2/ApiReference/UI_Components/dxDateRangeBox/Types/KeyUpEvent

Guide on how to get started with the dxDateRangeBox component.

```APIDOC
## dxDateRangeBox - Getting Started

### Description
This guide provides initial steps and examples for integrating and using the dxDateRangeBox component in your jQuery projects.

### Method
N/A

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
N/A
```
Tokens:
Raw