English
Layer
About 959 wordsAbout 3 min
2026-01-19
Layer
| API Name | Description |
|---|---|
| widget.showActionSheet | Display action menu |
| widget.showAlert | Display alert window |
| widget.showConfirm | Display confirmation window |
| widget.showPreloader | Display loading indicator |
| widget.hidePreloader | Hide loading indicator |
| widget.showModal | Display modal window |
| widget.showPrompt | Display input dialog |
| widget.showToast | Display Toast |
| widget.showDateTimePicker | Display date picker |
| widget.showEditor | Display text editor |
Display Single Selection Menu
Code Example:
FSOpen.widget.showActionSheet({
title: 'Title',
cancelBtnLabel: 'Cancel',
actionBtnLabels: ['Lakers', 'Spurs', 'Rockets'],
onSuccess: function(resp) {
if (resp.actionIndex == 0) {
alert('Selected Lakers');
} else if (resp.actionIndex == 1) {
alert('Selected Spurs');
} else {
alert('Selected Rockets');
}
},
onFail: function(error) {
alert('Failed, error code: ' + error.errorCode);
}
});Method: FSOpen.widget.showActionSheet
JS Version: 2.0.0
Client Support: 5.4.0+
Parameters:
| Parameter | Type | Required | Description |
|---|---|---|---|
| title | String | No | Title. If empty, Android shows "Options" by default, iOS shows nothing. |
| cancelBtnLabel | String | No | Cancel button text. Default: "Cancel". Dismisses the menu when clicked. |
| actionBtnLabels | Array[String] | Yes | List of option texts |
Success Callback Response:
| Parameter | Type | Description |
|---|---|---|
| actionIndex | Number | Selected index (0-based, increments top to bottom) |
Display Alert Window
Code Example:
FSOpen.widget.showAlert({
title: 'Title',
content: 'Message content',
btnLabel: 'Got it',
onSuccess: function(resp) {
// return nothing
},
onFail: function(error) {
alert('Failed, error code: ' + error.errorCode);
}
});Method: FSOpen.widget.showAlert
JS Version: 2.0.0
Client Support: 5.4.0+
Parameters:
| Parameter | Type | Required | Description |
|---|---|---|---|
| title | String | No | Alert title |
| content | String | No | Alert message content |
| btnLabel | String | No | Button text. Default: "OK" |
Display Confirmation Window
Code Example:
FSOpen.widget.showConfirm({
title: 'Title',
content: 'Message content',
btnLabels: ['Cancel','Confirm'],
onSuccess: function(resp) {
if (resp.btnIndex == 0) {
alert('Canceled');
} else {
alert('Confirmed');
}
},
onFail: function(error) {
alert('Failed, error code: ' + error.errorCode);
}
});Method: FSOpen.widget.showConfirm
JS Version: 2.0.0
Client Support: 5.4.0+
Parameters:
| Parameter | Type | Required | Description |
|---|---|---|---|
| title | String | No | Dialog title |
| content | String | No | Dialog message content |
| btnLabels | String | Yes | Button texts (max 2, left to right) |
Success Callback Response:
| Parameter | Type | Description |
|---|---|---|
| btnIndex | Number | Clicked button index (0=left, 1=right) |
Display Loading Indicator
Code Example:
FSOpen.widget.showPreloader({
text: 'Loading...',
icon: true,
onSuccess: function(resp) {
// do sth
},
onFail: function(error) {
// do sth
}
});Method: FSOpen.widget.showPreloader
JS Version: 2.0.0
Client Support: 5.4.0+
Parameters:
| Parameter | Type | Required | Description |
|---|---|---|---|
| text | String | No | Loading text. Empty means no text. |
| icon | Boolean | No | Whether to show icon. Default: true. If text is empty, icon is forced true. |
Hide Loading Indicator
Code Example:
FSOpen.widget.hidePreloader();Method: FSOpen.widget.hidePreloader
JS Version: 2.0.0
Client Support: 5.4.0+
Display Modal Dialog
Code Example:
FSOpen.widget.showModal({
title: 'Upgrade Notice',
imgUrl: 'https://open.fxiaoke.com/fscdn/img?imgId=group1/M00/02/04/rBEiBVfZFl6AOJ6eAABPHGYzNOo452.png',
content: 'New features available~',
btnLabels: ['Got it','Upgrade'],
onSuccess: function(resp) {
if (resp.btnIndex == 0) {
alert('Canceled');
} else {
alert('Confirmed');
}
},
onFail: function(error) {
alert('Failed, error code: ' + error.errorCode);
}
});Method: FSOpen.widget.showModal
JS Version: 2.0.0
Client Support: 5.4.0+
Parameters:
| Parameter | Type | Required | Description |
|---|---|---|---|
| title | String | No | Dialog title |
| imgUrl | String | No | Image URL. Empty means no image. |
| content | String | No | Dialog text content. Empty by default. |
| btnLabels | String | Yes | Button texts (max 2, left to right) |
Success Callback Response:
| Parameter | Type | Description |
|---|---|---|
| btnIndex | Number | Clicked button index (0=left, 1=right) |
Display Input Dialog
Code Example:
FSOpen.widget.showPrompt({
title: 'Title',
content: 'Message content',
btnLabels: ['Cancel','Confirm'],
onSuccess: function(resp) {
if (resp.btnIndex == 0) {
alert('Canceled');
} else {
alert('Confirmed');
}
},
onFail: function(error) {
alert('Failed, error code: ' + error.errorCode);
}
});Method: FSOpen.widget.showPrompt
JS Version: 2.0.0
Client Support: 5.4.0+
Parameters:
| Parameter | Type | Required | Description |
|---|---|---|---|
| title | String | No | Dialog title |
| content | String | No | Dialog message content |
| btnLabels | String | Yes | Button texts (max 2, left to right) |
Success Callback Response:
| Parameter | Type | Description |
|---|---|---|
| btnIndex | Number | Clicked button index (0=left, 1=right) |
| value | String | Input field value |
Display Toast
Code Example:
FSOpen.widget.showToast({
icon: 'success',
text: 'Message',
duration: 3000,
delay: 1000,
onSuccess: function(resp) {
// do sth
},
onFail: function(error) {
// do sth
}
});Method: FSOpen.widget.showToast
JS Version: 2.0.0
Client Support: 5.4.0+
Parameters:
| Parameter | Type | Required | Description |
|---|---|---|---|
| text | String | No | Toast message. Empty by default. |
| icon | String | No | Icon style: success or error. Default: success |
| duration | Number | No | Display duration (ms). Follows system default. |
| delay | Number | No | Delay before showing (ms). Default: 0 |
Display Date Picker
FSOpen.widget.showDateTimePicker({
dateType: 'month',
defaultValue: '2015-03-24',
onSuccess: function(resp) {
alert('Selected time: ' + resp.value);
},
onFail: function(error) {
alert('Failed, error code: ' + error.errorCode);
}
});Method: FSOpen.widget.showDateTimePicker
JS Version: 2.0.0
Client Support: 5.4.0+
Parameters:
| Parameter | Type | Required | Description |
|---|---|---|---|
| dateType | String | Yes | Picker type. Determines input/output format. |
| defaultValue | String | No | Default value. If empty, uses current time based on dateType. For time type, uses 24-hour format. |
dateType Values:
| Value | Format | Description |
|---|---|---|
| month | yyyy-MM | Year-Month |
| day | yyyy-MM-dd | Year-Month-Day |
| time | HH:mm | Hour:Minute (24h) |
| week | yyyy-MM-dd~yyyy-MM-dd | Week |
| day|time | yyyy-MM-dd HH:mm | Year-Month-Day Hour:Minute |
Success Callback Response:
| Parameter | Type | Description |
|---|---|---|
| value | String | Selected time string (matches dateType format). Uses 24-hour format if applicable. |
Display Text Editor
Code Example:
FSOpen.widget.showEditor({
min: 1,
max: 140,
placeholder: 'Enter content',
navbar: {
title: 'Title',
leftLabel: 'Back',
leftArrow: true,
rightLabel: 'Send'
},
backFillData: {
content: 'Input text',
},
components: ['emoji', 'at'],
onSuccess: function(resp) {
alert('Your input: ' + resp.content);
},
onFail: function(error) {
alert('Failed, error code: ' + error.errorCode);
}
});Method: FSOpen.widget.showEditor
JS Version: 2.0.0
Client Support: 5.4.0+
Parameters:
| Parameter | Type | Required | Description |
|---|---|---|---|
| min | Number | No | Minimum character limit (no Chinese/English distinction). Default: no limit |
| max | Number | No | Maximum character limit (max 3000 chars supported) |
| placeholder | String | No | Placeholder text. Default: empty |
| navbar | Object | No | Navigation bar controls (see below) |
| backFillData | Object | No | Prefill data (text only). Default: empty |
| components | Array[String] | No | Quick input components: emoji (emojis), at (@ mentions) |
navbar Fields:
| Field | Type | Description |
|---|---|---|
| title | String | Header title text |
| leftLabel | String | Left button text |
| leftArrow | Boolean | Whether to show left arrow icon (iOS only) |
| rightLabel | String | Right button text |
backFillData Fields:
| Field | Type | Description |
|---|---|---|
| content | String | Prefill text content |
Success Callback Response:
| Parameter | Type | Description |
|---|---|---|
| content | String | Plain text content (e.g., "Approved [smile], @Beijing R&D"). Emojis need H5 parsing |
