Mojo.Widget.Button

Namespace Detail

Overview

Buttons are the most basic UI element, which allow an action to be bound to a region. Buttons have a text label that can be updated dynamically. Button widgets are automatically styled to look like other buttons within the webOS.

Declaration 

<div x-mojo-element="Button" id="buttonId" class="buttonClass" name="buttonName"></div>
Properties Required Value Description
x-mojo-element Required Button Declares the widget as type 'Button'.
id Required Any String Identifies the widget element for use when instantiating or rendering; should be unique in the document.
class Optional Any String All buttons belong to the class palm-button, but you can override this with a custom class.
name Optional Any String Adds a unique name to the button widget; generally used in templates.

Events 

Mojo.Event.listen(this.controller.get("buttonId"),Mojo.Event.tap, this.handleUpdate);
Event Type Value Event Handling
Mojo.Event.tap None Respond to button tap

Instantiation 

this.controller.setupWidget("buttonId",
  this.attributes = {
  },
  this.model = {
      label : "BUTTON",
      disabled: false
  }
);

Attribute Properties

Attribute Property Type Required Default Description
label String Optional null Button's label if none is supplied by the model
type String Optional Mojo.Widget.defaultButton Type options:
  • Mojo.Widget.defaultButton - simple pushbutton
  • Mojo.Widget.activityButton- pushbutton with spinner activated on tap of the button
disabledProperty String Optional "disabled" Model property name for disabled
labelProperty String Optional "label" Model property name for label

Model Properties

Model Property Type Required Default Description
buttonLabel String Optional null DEPRECATED Button's label
buttonClass String Optional primary Model property that has the CSS class name of this button. Legal values are: "primary", "secondary", "affirmative", and "negative".
disabled Boolean Optional FALSE If true, button is inactive
label String Optional null Button's label

Methods

To invoke a method on a widget, use the scene controller's get method for the desired widget, and append mojo followed by the method.

Example: 

this.controller.get('myWidget').mojo.getValue()
Method Arguments Description
activate None For an activity button, start the spinner
deactivate None For an activity button, stop the spinner