Skip to content

Commit

Permalink
updated survey-library docs [azurepipelines skip]
Browse files Browse the repository at this point in the history
  • Loading branch information
dmitry-kurmanov committed Oct 15, 2024
1 parent 47c0e9f commit 50e48a2
Show file tree
Hide file tree
Showing 4 changed files with 31 additions and 16 deletions.
16 changes: 16 additions & 0 deletions docs/customize-question-types-add-custom-properties-to-a-form.md
Original file line number Diff line number Diff line change
Expand Up @@ -536,6 +536,22 @@ Serializer.addProperty("question",
);
```

### `availableInMatrixColumn`

A Boolean value that specifies whether the property is available in [matrix column](https://surveyjs.io/form-library/documentation/api-reference/multi-select-matrix-column-values) settings. Defaults to `false`.

If you enable this setting, the property will be added to the same [category](#category) and at the same [position](#visibleindex) that it has in a standalone question.

A matrix column's [`cellType`](https://surveyjs.io/form-library/documentation/api-reference/multi-select-matrix-column-values#cellType) must match the class name to which you add the property. For example, the following code adds a property to [Rating Scale](https://surveyjs.io/form-library/documentation/api-reference/rating-scale-question-model) questions and matrix columns of the `"rating"` `cellType`.

```js
import { Serializer } from "survey-core";

Serializer.addProperty("rating",
{ name: "myStringProperty", availableInMatrixColumn: true }
);
```

### `maxLength`

A numeric value that specifies the maximum number of characters users can enter into the text input.
Expand Down
2 changes: 0 additions & 2 deletions docs/data-validation.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,8 +28,6 @@ const surveyJson = {

Alternatively, you can [postpone data validation](#postpone-validation-until-survey-ends) until a respondent completes the survey.

> Immediate validation doesn't work with date input fields because of the way browsers process date values. In most browsers, the value is considered changed as soon as a user starts entering the date in a text input field. This means that a user may only enter the day without having the chance to enter the month and year before validation is triggered. For this reason, date input fields are validated before the survey is switched to the next page or completed.
## Built-In Client-Side Validators

SurveyJS Form Library supports multiple built-in client-side validators. The Required validator ensures that a question value is not empty. Enable a question's [`isRequired`](https://surveyjs.io/Documentation/Library?id=Question#isRequired) property to add the Required validator to this question. In addition, you can specify the [`requiredErrorText`](https://surveyjs.io/Documentation/Library?id=Question#requiredText) property to override the default error message:
Expand Down
14 changes: 6 additions & 8 deletions docs/design-survey-conditional-logic.md
Original file line number Diff line number Diff line change
Expand Up @@ -94,15 +94,13 @@ You can also use prefixes, such as `row`, `panel`, and `parentPanel`, to access
</thead>
<tbody>
<tr>
<td><a href="/form-library/documentation/api-reference/matrix-table-question-model" class="v2-class---paragraph-link">Single-Select Matrix</a></td>
<td rowspan="3" style="vertical-align:middle"><code>{row.columnname}</code></td>
<td rowspan="3" style="vertical-align:middle">Accesses a cell in the same row.</td>
<td rowspan="2" style="vertical-align:middle"><a href="/form-library/documentation/api-reference/matrix-table-question-model" class="v2-class---paragraph-link">Single-Select Matrix</a>, <a href="/form-library/documentation/api-reference/matrix-table-with-dropdown-list" class="v2-class---paragraph-link">Multi-Select Matrix</a>, <a href="/form-library/documentation/api-reference/dynamic-matrix-table-question-model" class="v2-class---paragraph-link">Dynamic Matrix</a></td>
<td><code>{row.columnname}</code></td>
<td>Accesses a cell in the same row.</td>
</tr>
<tr>
<td><a href="/form-library/documentation/api-reference/matrix-table-with-dropdown-list" class="v2-class---paragraph-link">Multi-Select Matrix</a></td>
</tr>
<tr>
<td><a href="/form-library/documentation/api-reference/dynamic-matrix-table-question-model" class="v2-class---paragraph-link">Dynamic Matrix</a></td>
<td style="vertical-align:middle"><code>{rowName}</code></td>
<td>Accesses the row name (the <code>value</code> property within objects in the <a href="https://surveyjs.io/form-library/documentation/api-reference/matrix-table-with-dropdown-list#rows"><code>rows</code></a> array). Use this placeholder if you need to distinguish between matrix rows.</td>
</tr>
<tr>
<td rowspan="2" style="vertical-align:middle"><a href="/form-library/documentation/api-reference/dynamic-panel-model" class="v2-class---paragraph-link">Dynamic Panel</a></td>
Expand Down Expand Up @@ -245,7 +243,7 @@ Expressions can include question names, variables, and calculated values (descri

### Supported Operators

The SurveyJS expression engine is built upon the <a href="https://pegjs.org/" target="_blank">PEG.js</a> parser generator. The following table gives a brief overview of operators that you can use within expressions. For a detailed look at the grammar rules used by the expression parser, refer to the [`survey-library`](https://github.com/surveyjs/survey-library/blob/master/packages/survey-core/src/expressions/grammar.pegjs) GitHub repository.
The SurveyJS expression engine is built upon the <a href="https://github.com/pegjs/pegjs" target="_blank">PEG.js</a> parser generator. The following table gives a brief overview of operators that you can use within expressions. For a detailed look at the grammar rules used by the expression parser, refer to the [`survey-library`](https://github.com/surveyjs/survey-library/blob/master/packages/survey-core/src/expressions/grammar.pegjs) GitHub repository.

| Operator | Description | Expression example |
| -------- | ----------- | ------------------ |
Expand Down
15 changes: 9 additions & 6 deletions docs/icons.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,7 @@ description: View the list of all available built-in icons used in SurveyJS libr
---
# UI Icons

This help topic describes icons built into SurveyJS components and shows how you can replace them with custom icons.

- [Built-In Icons](#built-in-icons)
- [Custom Icons](#custom-icons)
This help topic describes icons built into SurveyJS components and shows how you can customize them.

## Built-In Icons

Expand All @@ -17,7 +14,11 @@ SurveyJS uses icons in SVG format. The following built-in SVG icons are availabl
style="width:100%; border:0; overflow:hidden;">
</iframe>

The following code shows how you can swap two built-in icons. It uses the `icon-export` icon instead of `icon-import`, and vice versa:
## Icon Customization

### Swap Two Built-In Icons

Swapping two built-in icons allows you to use one icon from the SurveyJS library instead of another, and vice versa. The following code shows how to swap the `icon-export` and `icon-import` icons:

```js
Survey.settings.customIcons["icon-import"] = "icon-export";
Expand All @@ -29,7 +30,9 @@ settings.customIcons["icon-import"] = "icon-export";
settings.customIcons["icon-export"] = "icon-import";
```

## Custom Icons
<div id="custom-icons"></div>

### Use Custom SVG Icons

If you want to replace a built-in icon with a custom SVG icon, call the `registerIconFromSvg` method on the `SvgRegistry` object. Pass the name of the built-in icon as the first argument and the custom icon markup converted to a string as the second argument. In the following code, a custom icon replaces the `icon-delete` icon:

Expand Down

0 comments on commit 50e48a2

Please sign in to comment.