- 필수 기능
- 시작하기
- Glossary
- 표준 속성
- Guides
- Agent
- 통합
- 개방형텔레메트리
- 개발자
- Administrator's Guide
- API
- Datadog Mobile App
- CoScreen
- Cloudcraft
- 앱 내
- 서비스 관리
- 인프라스트럭처
- 애플리케이션 성능
- APM
- Continuous Profiler
- 스팬 시각화
- 데이터 스트림 모니터링
- 데이터 작업 모니터링
- 디지털 경험
- 소프트웨어 제공
- 보안
- AI Observability
- 로그 관리
- 관리
This page provides a list of UI components that you can use when creating apps in App Builder.
Many component properties allow you to select from provided values. If you want to use an expression for a property’s value, click </> next to the property to use the code editor. For more information on using JavaScript in App Builder, see JavaScript Expressions.
Button components have the following properties.
For more information on events, see Events.
Displays property and value pairs in JSON format.
To view this component in context, see the Metrics Explorer & Monitors Builder app blueprint.
Callout value components have the following properties.
Displays property and value pairs in JSON format.
To view this component in context, see the EC2 Instance Manager app blueprint.
Checkbox components have the following properties.
label
and value
key-value pair. The minimum number of options is 1.${[
{
"label": "Staging",
"value": "staging"
},
{
"label": "Production",
"value": "production"
}
]}
For more information on events, see Events.
Displays property and value pairs in JSON format.
To view this component in context, see the Metrics Explorer & Monitors Builder app blueprint.
Container components have the following properties.
Displays property and value pairs in JSON format.
To view this component in context, see the Metrics Explorer & Monitors Builder app blueprint.
Custom chart components have the following properties.
Displays property and value pairs in JSON format.
For an example showing how to use this component, see Custom charts.
Date range picker components have the following properties.
For more information on events, see Events.
Displays property and value pairs in JSON format.
To view this component in context, see the Metrics Explorer & Monitors Builder app blueprint.
File input components have the following properties.
For more information on events, see Events.
Displays property and value pairs in JSON format.
JSON input components have the following properties.
For more information on events, see Events.
Displays property and value pairs in JSON format.
Modal components have the following properties.
modal0.setIsOpen(true)
sets the state of modal0
to open.For more information on events, see Events.
Displays property and value pairs in JSON format.
To view this component in context, see the Metrics Explorer & Monitors Builder app blueprint.
Number input components have the following properties.
numberInput0.setValue(3)
sets the value of the numberInput0
component to 3
.For more information on events, see Events.
Displays property and value pairs in JSON format.
To view this component in context, see the ECS Task Manager app blueprint.
Radio components have the following properties.
label
and value
key-value pair.${[
{
"label": "Staging",
"value": "staging"
},
{
"label": "Production",
"value": "production"
}
]}
radioButtons0.setValue("production")
sets the value of the radioButtons0
component to "production"
.For more information on events, see Events.
Displays property and value pairs in JSON format.
Search components have the following properties.
search0.setValue("search query")
sets the value of the search0
component to "search query"
.For more information on events, see Events.
Displays property and value pairs in JSON format.
To view this component in context, see the EC2 Instance Manager app blueprint.
Select components have the following properties.
label
and value
key-value pair.${[
{
"label": "Staging",
"value": "staging"
},
{
"label": "Production",
"value": "production"
}
]}
select0.setValue("staging")
sets the value of the select0
component to "staging"
.For more information on events, see Events.
Displays property and value pairs in JSON format.
To view this component in context, see the Metrics Explorer & Monitors Builder app blueprint.
Tab components have the following properties.
A list of tab views. Use the + (plus) to add additional views.
tab0.setTabIndex(0)
sets the value of the tab0
component to the first tab.For more information on events, see Events.
Displays property and value pairs in JSON format.
Table components have the following properties.
Each column of data from the data source is represented here and has the following properties:
Some columns have additional properties based on their Formatting property.
Adding a row action adds an Actions column to the table, which contains user-defined action buttons. These buttons have the following properties:
table0.setSelectedRow(0)
sets the selectedRow
property of table0
to the first row.table0.setSelectedRow(null)
clears the selectedRow
property.table0.setPageIndex(0)
sets the pageIndex
property of table0
to the first page.For more information on events, see Events.
Displays property and value pairs in JSON format.
To view this component in context, see the Metrics Explorer & Monitors Builder app blueprint.
For examples showing how to use advanced features of tables, see Tables.
Text components have the following properties.
Displays property and value pairs in JSON format.
To view this component in context, see the Metrics Explorer & Monitors Builder app blueprint.
Text area components have the following properties.
textArea0.setValue("text")
sets the value of the textArea0
component to "text"
.For more information on events, see Events.
Displays property and value pairs in JSON format.
Text input components have the following properties.
textInput0.setValue("text")
sets the value of the textInput0
component to "text"
.For more information on events, see Events.
Displays property and value pairs in JSON format.
To view this component in context, see the Metrics Explorer & Monitors Builder app blueprint.
추가 유용한 문서, 링크 및 기사:
Do you have questions or feedback? Join the #app-builder channel on the Datadog Community Slack.