Fork me on GitHub

Also check out the Buttons on Forms page.

Button

Button Widget

Here's an example that creates a simple button. When the button is clicked, it will display a message.

var content = {};
content['my_button'] = {
  theme: 'button',
  text: 'My Button',
  attributes: {
    onclick: "drupalgap_alert('You clicked me!');"
  }
};
return content;

Button Link

Button Link Widgets

Here's an example button link. When the button is clicked, the app will display node 123.

var content = {};
content['my_button_link'] = {
  theme: 'button_link',
  text: 'My Button Link',
  path: 'node/123'
};
return content;

Button Icons

With jQuery Mobile Icons, we can use the data-icon attribute to set the icon on buttons.

Button Link with Icon

Button Widget with Icon

var content = {};
content['my_button_link'] = {
  theme: 'button_link',
  text: 'My Button Link',
  path: 'node/123',
  attributes: {
    'data-icon': 'cloud'
  }
};
return content;

Button Link with Only an Icon, no Text

Button Widget with no Text

var content = {};
content['my_button_link'] = {
  theme: 'button_link',
  text: 'My Button Link',
  path: 'node/123',
  attributes: {
    'data-icon': 'cloud',
    'data-iconpos': 'notext'
  }
};
return content;