JavaScript/jQuery Form - ButtonItem
Configures a button form item.
A button form item, as the name implies, consists of a button that does a custom action. You can customize the button's appearance and position on the form.
alignment
Use the horizontalAlignment instead.
Specifies the button's horizontal alignment.
Use the HorizontalAlignment enum to specify this property when the UI component is used as an ASP.NET MVC 5 Control or a DevExtreme-Based ASP.NET Core Control. This enum accepts the following values: Left, Right, and Center.
buttonOptions
Configures the button.
See the Button configuration for properties that you can specify in this object.
jQuery
$(function() {
$("#formContainer").dxForm({
// ...
items: [{
itemType: "button",
buttonOptions: {
text: "Do Something",
type: "success",
onClick: function () {
// Implement your logic here
}
}
},
// ...
]
});
});Angular
<dx-form ...>
<dxi-item
itemType="button"
[buttonOptions]="buttonOptions">
</dxi-item>
</dx-form>
import { DxFormModule } from "devextreme-angular";
// ...
export class AppComponent {
buttonOptions = {
text: "Do Something",
type: "success",
onClick: function () {
// Implement your logic here
}
};
}
@NgModule({
imports: [
// ...
DxFormModule
],
// ...
})horizontalAlignment
Specifies the button's horizontal alignment.
Use the HorizontalAlignment enum to specify this property when the UI component is used as an ASP.NET MVC 5 Control or a DevExtreme-Based ASP.NET Core Control. This enum accepts the following values: Left, Right, and Center.
itemType
Specifies the item's type. Set it to "button" to create a button item.
See Also
name
Specifies the item's identifier.
Use this name to access the form item in the itemOption(id) and getButton(name) methods.
verticalAlignment
Specifies the button's vertical alignment.
Use the VerticalAlignment enum to specify this property when the UI component is used as an ASP.NET MVC 5 Control or a DevExtreme-Based ASP.NET Core Control. This enum accepts the following values: Bottom, Center, and Top.
visibleIndex
Specifies the item's position regarding other items in a group, tab, or the whole UI component.
Form items without the specified visibleIndex follow the items with it, and they are sorted alphabetically.