GWTBootstrap-掩蓋日期選擇器

Question

要求：在模糊/表單提交時屏蔽日期選擇器。

我能夠將forceparse設置為false，從而在onBlur上完成掩膜，但是我無法導航到datepicker中的下個月/年，這可能是因為我覆蓋了DOM處理程序。

dob.setForceParse(false);
dob.addDomHandler(new BlurHandler() {           
    @Override
    public void onBlur(BlurEvent event) {               
        dob.getTextBox().setText(**masked value**);
    }
}, BlurEvent.getType());
dob.addDomHandler(new FocusHandler() {          
    @Override
    public void onFocus(FocusEvent event) {
        dob.setValue(**unmasked value**);
    }
}, FocusEvent.getType());

我無法使用ChangeDateHandler，因為它會自動將“ 1/1/19”假定為“ 1/1/1900”，並在輸入文本的中間屏蔽文本。 我還有其他方法可以解決嗎？

Answer 1

如果您在使用DatePicker的TextBox遇到問題，則可以將其隱藏並使用其他任何Widget。

TextBox基本上用於顯示聚焦時的DatePicker ，顯示所選日期和手動輸入日期。

這是一個示例代碼，如何將自己的TextBox與DatePicker一起使用（我使用VerticalPanel在TextBox下方顯示DatePicker ）：

VerticalPanel container = new VerticalPanel();

final DatePicker dob = new DatePicker();

// hide DatePicker's TextBox
dob.getTextBox().getElement().getStyle().setDisplay(Display.NONE);

final TextBox box = new TextBox(); 
box.addFocusHandler(new FocusHandler() {
    @Override
    public void onFocus(FocusEvent event) {
        dob.show();
        box.setText("**unmasked value**");
    }
});

dob.addHideHandler(new HideHandler() {
    @Override
    public void onHide(HideEvent hideEvent) {
        box.setText("**masked value**");
    }
});

dob.addChangeDateHandler(new ChangeDateHandler() {
    @Override
    public void onChangeDate(ChangeDateEvent evt) {
        Window.alert("ChangeDateEvent");
    }
});

container.add(box);
container.add(dob);

請注意，當TextBox dob.show()焦點狀態時，您需要調用dob.show() 。 我還使用DatePicker的HideHandler而不是TextBox的BlurHandler來顯示掩碼值，但是您可以根據需要更改它。

如果要更改諸如"1/1/19"類的日期解析方式，現在可以將自己的解析器添加到TextBox 。