Print Page - new component: tristatebox

TriStateBox is a jQuery EasyUI component that renders a three-state selector (1/0/null) inside a standard textbox shell.

It preserves EasyUI labeling, sizing, and form behavior while replacing text input with three equal-width buttons.

Values map to Y, N, and ? with customizable labels via symY, symN, and symU.

Public API: getValue(), setValue(v), clear(), reset(), enable(), disable(), resize(w), destroy().

It normalizes JSON inputs (1, 0, null, '1', '0') and fires onChange(oldVal, newVal) on state changes.

Code:

$('#test').tristatebox({
  label: 'Label:'
, labelPosition: 'before'
, labelAlign: 'left'
, value: null
, onChange: function (o, n) { console.log('TriState change:', o, '→', n); }
});

(https://www.jeasyui.com/forum/index.php?action=dlattach;topic=8856.0;attach=2360;image)

Code:

$(`#test2`).tristatebox({
  value: 0
, symY: 'label Yes'
, symN: 'label No'
, symU: 'off'
});

(https://www.jeasyui.com/forum/index.php?action=dlattach;topic=8856.0;attach=2362;image)

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: Coder on September 04, 2025, 11:06:28 AM