You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 13 Next »

The <button> tag adds a button to your widget form. This element behavior is similar to React's

Available attributes:

AttributeTypeMandatoryDescription
buttonTypeStringN

Specify button displaying style for forms and lists

The disabled buttons appear in gray. 

  • unstyled – a white color button
  • primary – a blue color button
  • approve – a green color button
  • destructive – a red color button
  • secondary – a transparent background for the button

Use the following button types along with the svg attribute:

  • icon-mini – a small square button

  • icon – a square button

  • icon-primary – a square button with blue background
  • icon-border – a square button with borders
disabledBooleanNSpecify whether the button should be disabled. A disabled button cannot be clicked.

isVisible

BooleanNThe default value is true. To disable tag display, set it false.
svgStringNSpecify the SVG code of a pre-decoded image file.
hintStringNSpecify the button text hint.
classStringNSpecify the CSS class name that is defined in the CSS field of the widget.

To set a button, follow the example below:

Button
<checkbox model="data.userCanReject" event-change="window.s_widget_custom.canCheckboxHandler();"></checkbox>
  
<button buttonType="destructive" disabled={data.userCanReject} event-click="window.s_widget_custom.reject();">
  {data.rejectBtnTitle}
</button>


  • No labels