Vue Form - TabbedItem.tabs
colCount
For extra small screens, this option always equals 1 to make the widget adaptive. Specify the colCountByScreen option to override this logic.
jQuery
$(function() { $("#formContainer").dxForm({ // ... items: [{ itemType: "tabbed", tabs: [{ // ... colCountByScreen: { xs: 2 } }, // ... ], }, // ... ] }); });
Angular
<dx-form ... > <dxi-item itemType="tabbed"> <dxi-tab ... > <dxo-col-count-by-screen [xs]="2"></dxo-col-count-by-screen> </dxi-tab> </dxi-item> </dx-form>
import { DxFormModule } from "devextreme-angular"; // ... export class AppComponent { // ... } @NgModule({ imports: [ // ... DxFormModule ], // ... })
icon
This option accepts the name of an icon from the built-in icon library, a path to the icon image, or a CSS class of an icon stored in an external icon library. For information on using external icon libraries, refer to the Icon Library article.
items
Array<Simple Form Item | Group Form Item | Tabbed Form Item | Empty Form Item | Button Form Item>
Like the items option of the Form widget, the array passed to the items field of a tab can hold items of the following types.
Simple
A standard item consisting of a label and an editor widget used to specify a value of the associated data field.Group
An item representing a container of other form items.Tabbed
An item representing a tabbed container of other form items.Empty
An empty item used to add a space between neighboring items.
If you have technical questions, please create a support ticket in the DevExpress Support Center.