DevExtreme jQuery - Specify Display Mode
By default, the ActionSheet comes up from the bottom of the page. If you set the usePopover option to true, the action sheet will pop over a certain element on the page. Use the target option to specify this element.
jQuery
JavaScript
$(function() {
$("#actionSheetContainer").dxActionSheet({
dataSource: actionSheetData,
usePopover: true,
target: "#actionSheetTarget"
});
});Angular
HTML
TypeScript
<dx-action-sheet
[dataSource]="actionSheetData"
[usePopover]="true"
target="#actionSheetTarget">
</dx-action-sheet>
import { DxActionSheetModule } from "devextreme-angular";
// ...
export class AppComponent {
// ...
}
@NgModule({
imports: [
// ...
DxActionSheetModule
],
// ...
})See Also
- ActionSheet - Customize Item Appearance
- ActionSheet API Reference
- Configure a Widget: Angular | Vue | React | jQuery | AngularJS | Knockout | ASP.NET MVC 5 | ASP.NET Core
Feedback