Check documentation for the latest version of dhtmlxSuite ButtonTwoState Control DHTMLX Docs

ButtonTwoState Control

a button that can remain in one of its two states until its current state is changed by user (either from script or from page):

Adding ButtonTwoState

The addButtonTwoState method should be used to add a new buttonTwoState:

myToolbar.addButtonTwoState(id, pos, text, imgEnabled, imgDisabled);

The user should pass a number of parameters to this method:

  • id - id of the new button;
  • pos - position of the new button;
  • text - button's label;
  • imgEnabled - path to image for the enabled state of a new button;
  • imgDisabled - path to image for the disabled state of a new button.

Note: if the user wants the buttonTwoState to be created text-free, it's necessary to write an empty string as text parameter.

Related sample:  ButtonTwoState creation

Working with ButtonTwoState

The following methods that are available for the Button item, can be applied to the buttonTwoState item as well:

Showing/Hiding ButtonTwoState

  • myToolbar.showItem(id);
  • myToolbar.hideItem(id);
  • myToolbar.isVisible(id);

Related sample:  ButtonTwoState manipulation

Enabling/Disabling ButtonTwoState

  • myToolbar.enableItem(id);
  • myToolbar.disableItem(id);
  • myToolbar.isEnabled(id);

Related sample:  ButtonTwoState state

Setting/Getting ButtonTwoState Text

  • myToolbar.setItemText(id, text);
  • myToolbar.getItemText(id);

Related sample:  ButtonTwoState text

Manipulating ButtonTwoState Images

  • myToolbar.setItemImage(id, url);
  • myToolbar.setItemImageDis(id, url);
  • myToolbar.clearItemImage(id);
  • myToolbar.clearItemImageDis(id);

Related sample:  ButtonTwoState image

Setting/Getting ButtonTwoState Tooltip

  • myToolbar.setTooltip(id,tip);
  • myToolbar.getItemToolTip(id).

Related sample:  ButtonTwoState tooltip

All the parameters of the above mentioned methods are the same as those described in the Button Settings Manipulations section.

Setting State of ButtonTwoState

The user can set one of two states for ButtonTwoState with the help of the following method:

myToolbar.setItemState(id, state, callEvent);

The parameters for this method are the following:

  • id - id of the two-state button;
  • state - true/false, true stands for the Pressed state of the button, false stands for the Released state of the button;
  • callEvent - if set to true, calls user defined handler for the onStateChange event (if there is any).

There is also the possibility to get current item's state by calling the getItemState method:

var isPressed = myToolbar.getItemState(id); // returns true/false

The method returns true in case the button is pressed, and false in case the button is released.

Back to top