- Framework7 Tutorial
- Framework7 - Home
- Framework7 - Overview
- Framework7 - Environment
- Framework7 Components
- Framework7 - Layouts
- Framework7 - Navbars
- Framework7 - Toolbars
- Framework7 - Search Bar
- Framework7 - Status Bar
- Framework7 - Side Panels
- Framework7 - Content Block
- Framework7 - Layout Grid
- Framework7 - Overlays
- Framework7 - Preloaders
- Framework7 - Progress Bar
- Framework7 - List Views
- Framework7 - Accordion
- Framework7 - Cards
- Framework7 - Chips
- Framework7 - Buttons
- Framework7 - Action Button
- Framework7 - Forms
- Framework7 - Tabs
- Framework7 - Swiper Slider
- Framework7 - Photo Browser
- Framework7 - Autocomplete
- Framework7 - Picker
- Framework7 - Calendar
- Framework7 - Refresh
- Framework7 - Infinite Scroll
- Framework7 - Messages
- Framework7 - Message Bar
- Framework7 - Notifications
- Framework7 - Lazy Load
- Framework7 Styling
- Framework7 - Color Themes
- Framework7 - Hairlines
- Framework7 Templates
- Framework7 - Templates Overview
- Framework7 - Auto Compilation
- Framework7 - Template7 Pages
- Framework7 Fast Clicks
- Framework7 - Active State
- Framework7 - Tap Hold Event
- Framework7 - Touch Ripple
- Framework7 Useful Resources
- Framework7 - Quick Guide
- Framework7 - Useful Resources
- Framework7 - Discussion
Framework7 - Action Sheet
Description
The Action Sheet is used to present the user with a set of possibilities for how to handle a given task. It can also be used to prompt the user to handle potential actions, which are dangerous. The Action Sheet consists of an optional title and one or more buttons. Each button is dedicated to an action to take.
The Action Sheet is not suggested to use on large screens such as iPad, instead use popover.
The following table shows how to use Action Sheet in Framework7 −
S.No | Action Sheet types & Description |
---|---|
1 | Create and open Action Sheet
It is the dynamic element, which can be created and opened using JavaScript. |
2 | Convert Action Sheet to Popover
You can use the extended Action Sheet syntax to automatically convert Action Sheet to popover. |
3 | Close Action Sheet
The Action Sheet can be closed manually by using the appropriate app's method. |
4 | Action Sheet Events
To detect how a user interacts with the Action Sheet, you can use Action Sheetevents. |
5 | Action Sheet Template
You can customize Action Sheet template by passing modalActionsTemplate parameter on App initialization. |
6 | Action Sheet To Popover Template
Whenever you use Action Sheet convertation to popover, you can customize popover template by passing modalActionsToPopoverTemplate parameter on App initialization. |