DevExtreme jQuery/JS - Overview
The MultiView is a widget that contains several views. An end user navigates through the views by swiping them in the horizontal direction. The widget is often used along with the Tabs widget.
In the most simple case, the MultiView widget requires only the dataSource option to be configured. Note that in such a case, data source items should have a structure similar to the Default Item Template. The following code adds the MultiView to your page.
jQuery
<div id="multiViewContainer">
var multiViewItems = [ { text: "Personal Data" }, { text: "Contacts" }, { text: "Address" } ]; $(function() { $("#multiViewContainer").dxMultiView({ dataSource: multiViewItems }); });
Angular
<dx-multi-view> <dxi-item text="Personal Data"></dxi-item> <dxi-item text="Contacts"></dxi-item> <dxi-item text="Address"></dxi-item> </dx-multi-view>
import { DxMultiViewModule } from "devextreme-angular"; // ... export class AppComponent { // ... } @NgModule({ imports: [ // ... DxMultiViewModule ], // ... })
More often, structure of the data source item differs from the default. For correct rendering of views, specify a custom template.
See Also
If you have technical questions, please create a support ticket in the DevExpress Support Center.