2016-12-02 21 views
0

要件:blur/form submitのdatepickerをマスクします。GWTBootstrap - マスキング日付ピッカー

forceparseをfalseに設定してonBlurをマスキングすることができましたが、DOMハンドラをオーバーライドしているため、datepickerで次の月/年に移動できません。それは自動的に「1900/1/1」とマスクとして入力したテキストのテキスト途中で「1/1/19」を前提としているので

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を使用することができません。私はこれを扱うことができる他の方法はありますか?

答えて

0

DatePickerTextBoxで問題が発生している場合は、それを非表示にして、代わりに他のウィジェットを使用できます。

TextBoxは基本的にはフォーカスが当たったときにDatePickerを表示し、選択した日付を表示し、日付を手動で入力するために使用されます。ここで

は(私はちょうどTextBox下にDatePickerを表示するVerticalPanelを使用)DatePickerTextBox独自のものを使用する方法のコード例です:

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()を呼び出す必要があること、気づきます。 TextBoxBlurHandlerの代わりにDatePickerHideHandlerを使用してマスクされた値を表示しますが、希望するとおりに変更することができます。

"1/1/19"のような日付の解析方法を変更したい場合は、TextBoxに独自のパーサーを追加することができます。