Skip to main content

Button properties

Usage​

{
    type: "button",
    name?: string,
    id?: string,
    
    text?: string,
    submit?: boolean, // false by default
    url?: string,
    
    css?: string,
    disabled?: boolean, // false by default
    height?: string | number | "content", // "content" by default
    hidden?: boolean, // false by default
    padding?: string | number, // "8px" by default
    width?: string | number | "content", // "content" by default

    // button view
    circle?: boolean, // false by default
    color?: "danger" | "secondary" | "primary" | "success", // "primary" by default
    full?: boolean, // false by default
    icon?: string,
    loading?: boolean, // false by default
    size?: "small" | "medium", // "medium" by default
    view?: "flat" | "link", // "flat" by default
}

Description​

type(required) the type of a control, set it to "button"
name(optional) the name of a control
id(optional) the id of a control, auto-generated if not set
text(optional) the text label of a button
submit(optional) enables the button to send form data to a server, false by default
url(optional) the URL the post request with form data will be sent to.
The property is required if the submit property is set to true

Related Sample: Form. All controls
css(optional) adds style classes to a control
disabled(optional) defines whether a control is enabled (false) or disabled (true), false by default
height(optional) the height of a control, "content" by default
hidden(optional) defines whether a control is hidden, false by default
padding(optional) sets padding between a cell and a border of a button control, "8px" by default
width(optional) the width of a control, "content" by default
circle(optional) makes the corners of a button round, false by default
color(optional) defines the color scheme of a button: "danger" | "secondary" | "primary" | "success", "primary" by default
full(optional) extends a button to the full width of a form, false by default
icon(optional) an icon of the button
loading(optional) adds a spinner into a button, false by default
size(optional) defines the size of a button: "small" | "medium", "medium" by default
view(optional) defines the look of a button: "flat" | "link", "flat" by default

Example​

Related article: Button