com.extjs.gxt.ui.client.widget.form.TriggerField Maven / Gradle / Ivy
Go to download
Show more of this group Show more artifacts with this name
Show all versions of gxt Show documentation
Show all versions of gxt Show documentation
Rich Internet Application Framework for GWT
/*
* Sencha GXT 2.3.1a - Sencha for GWT
* Copyright(c) 2007-2013, Sencha, Inc.
* [email protected]
*
* http://www.sencha.com/products/gxt/license/
*/
package com.extjs.gxt.ui.client.widget.form;
import com.extjs.gxt.ui.client.GXT;
import com.extjs.gxt.ui.client.core.El;
import com.extjs.gxt.ui.client.event.ComponentEvent;
import com.extjs.gxt.ui.client.event.DomEvent;
import com.extjs.gxt.ui.client.event.Events;
import com.extjs.gxt.ui.client.event.FieldEvent;
import com.extjs.gxt.ui.client.event.PreviewEvent;
import com.extjs.gxt.ui.client.util.BaseEventPreview;
import com.extjs.gxt.ui.client.util.Size;
import com.google.gwt.event.dom.client.KeyCodes;
import com.google.gwt.user.client.Command;
import com.google.gwt.user.client.DOM;
import com.google.gwt.user.client.DeferredCommand;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.Event;
/**
* Provides a convenient wrapper for TextFields that adds a clickable trigger
* button (looks like a combobox by default).
*
*
* - Events:
*
* - TriggerClick : FieldEvent(field, event)
* Fires after the trigger is clicked.
*
* - field : this
* - event : event
*
*
*
*
*
* - Inherited Events:
* - Field Focus
* - Field Blur
* - Field Change
* - Field Invalid
* - Field Valid
* - Field KeyPress
* - Field SpecialKey
*
*/
@SuppressWarnings("deprecation")
public class TriggerField extends TextField {
protected BaseEventPreview focusEventPreview;
protected El trigger;
protected String triggerStyle = "x-form-trigger-arrow";
protected boolean mimicing;
private boolean editable = true;
private boolean monitorTab = true;
private boolean hideTrigger;
public TriggerField() {
super();
}
/**
* Returns the trigger style.
*
* @return the trigger style
*/
public String getTriggerStyle() {
return triggerStyle;
}
/**
* Returns true if the combo is editable.
*
* @return true if editable
*/
public boolean isEditable() {
return editable;
}
/**
* Returns true if the trigger is hidden.
*
* @return the hide trigger state
*/
public boolean isHideTrigger() {
return hideTrigger;
}
/**
* Returns true if tab key events are being monitored.
*
* @return true if monitoring
*/
public boolean isMonitorTab() {
return monitorTab;
}
/**
* Allow or prevent the user from directly editing the field text. If false is
* passed, the user will only be able to select from the items defined in the
* dropdown list.
*
* @param editable true to allow the user to directly edit the field text
*/
public void setEditable(boolean editable) {
this.editable = editable;
if (rendered) {
El fromEl = getInputEl();
if (!readOnly) {
fromEl.dom.setPropertyBoolean("readOnly", !editable);
}
fromEl.setStyleName("x-triggerfield-noedit", !editable);
if (GXT.isAriaEnabled()) {
fromEl.dom.setAttribute("aria-readonly", editable ? "false" : "true");
}
}
}
/**
* True to hide the trigger (defaults to false, pre-render).
*
* @param hideTrigger true to hide the trigger
*/
public void setHideTrigger(boolean hideTrigger) {
this.hideTrigger = hideTrigger;
}
/**
* True to monitor tab key events to force the bluring of the field (defaults
* to true).
*
* @param monitorTab true to monitor tab key events
*/
public void setMonitorTab(boolean monitorTab) {
this.monitorTab = monitorTab;
}
/**
* Sets the trigger style name.
*
* @param triggerStyle
*/
public void setTriggerStyle(String triggerStyle) {
this.triggerStyle = triggerStyle;
}
@Override
public void setReadOnly(boolean readOnly) {
this.readOnly = readOnly;
if (rendered) {
el().setStyleName(readOnlyFieldStyle, readOnly);
if (editable || (readOnly && !editable)) {
getInputEl().dom.setPropertyBoolean("readOnly", readOnly);
}
}
}
@Override
protected Size adjustInputSize() {
return new Size(hideTrigger ? 0 : trigger.getStyleSize().width, 0);
}
@Override
protected void afterRender() {
super.afterRender();
addStyleOnOver(trigger.dom, "x-form-trigger-over");
removeStyleName(fieldStyle);
}
protected void beforeBlur() {
}
protected void mimicBlur(PreviewEvent e, Element target) {
if (!el().dom.isOrHasChild(target) && validateBlur(e, target)) {
triggerBlur(null);
}
}
@Override
protected void onKeyDown(FieldEvent fe) {
super.onKeyDown(fe);
if (monitorTab && fe.getKeyCode() == KeyCodes.KEY_TAB) {
triggerBlur(fe);
}
}
@Override
protected void onBlur(ComponentEvent ce) {
}
@Override
protected void onClick(ComponentEvent ce) {
if (!readOnly
&& ((!editable && getInputEl().dom.isOrHasChild(ce.getTarget())) || (trigger.dom.isOrHasChild(ce.getTarget())))) {
onTriggerClick(ce);
}
super.onClick(ce);
}
@Override
protected void onDisable() {
super.onDisable();
addStyleName("x-item-disabled");
}
@Override
protected void onEnable() {
super.onEnable();
removeStyleName("x-item-disabled");
}
@Override
protected void onFocus(ComponentEvent ce) {
super.onFocus(ce);
if (!mimicing) {
addStyleName("x-trigger-wrap-focus");
mimicing = true;
focusEventPreview.add();
}
}
@Override
protected void onRender(Element target, int index) {
focusEventPreview = new BaseEventPreview() {
protected boolean onAutoHide(final PreviewEvent ce) {
if (ce.getEventTypeInt() == Event.ONMOUSEDOWN) {
mimicBlur(ce, ce.getTarget());
}
return false;
}
};
if (el() != null) {
super.onRender(target, index);
return;
}
setElement(DOM.createDiv(), target, index);
if (!isPassword()) {
input = new El(DOM.createInputText());
} else {
input = new El(DOM.createInputPassword());
}
addStyleName("x-form-field-wrap");
input.addStyleName(fieldStyle);
trigger = new El(GXT.isHighContrastMode ? DOM.createDiv() : DOM.createImg());
trigger.dom.setClassName("x-form-trigger " + triggerStyle);
trigger.dom.setPropertyString("src", GXT.BLANK_IMAGE_URL);
if (GXT.isAriaEnabled()) {
trigger.dom.setPropertyString("alt", "Dropdown");
}
el().appendChild(input.dom);
el().appendChild(trigger.dom);
if (hideTrigger) {
trigger.setVisible(false);
}
super.onRender(target, index);
if (!editable) {
setEditable(false);
}
}
@Override
protected void onResize(int width, int height) {
super.onResize(width, height);
if ((GXT.isIE6 || GXT.isIE7) && !hideTrigger) {
int y;
if ((y = input.getY()) != trigger.getY()) {
trigger.setY(y);
}
}
}
protected void onTriggerClick(ComponentEvent ce) {
fireEvent(Events.TriggerClick, ce);
}
protected void triggerBlur(ComponentEvent ce) {
DeferredCommand.addCommand(new Command() {
public void execute() {
getFocusEl().blur();
}
});
mimicing = false;
focusEventPreview.remove();
beforeBlur();
removeStyleName("x-trigger-wrap-focus");
super.onBlur(ce);
}
protected boolean validateBlur(DomEvent ce, Element target) {
return true;
}
}