2012-05-04 170 views
12

是否有任何知道Google Web Toolkit文本輸入窗口小部件在空字段時會在字段內顯示消息?如何將佔位符添加到GWT文本輸入字段

E.g.第一個名字字段會說:'輸入你的名字',當用戶開始輸入時,標籤被刪除以顯示輸入的文字。

你會怎麼做呢?

丹尼爾

回答

31

這並不在一個文本對我的工作:

yourInputField.getElement().setPropertyString("placeholder", "enter your first name"); 

我認爲這是一個HTML5特性。

+0

太棒了。完美的作品。 – supercobra

1

有了這個解決方案可以定義粘結劑XML任何附加屬性:

解決辦法:

public class MorePropertiesTextArea extends TextArea { 
    private String moreProperties; 

    public MorePropertiesTextArea() {} 

    public void setMoreProperties(String moreProperties) { 
     for (Entry<String, String> entry : parse(moreProperties).entrySet()) { 
      getElement().setAttribute(entry.getKey(), entry.getValue()); 
     } 
     this.moreProperties = moreProperties; 
    } 


    public String getMoreProperties() { 
     return moreProperties; 
    } 

    private Map<String, String> parse(String moreProperties) { 
     String[] pairStrings = moreProperties.split(";"); 
     HashMap<String, String> map = new HashMap<>(); 
     for (String pairString : pairStrings) { 
      String[] pair = pairString.split("="); 
      if(pair.length != 2) 
       throw new IllegalArgumentException("at " + pair + " while parsing " + moreProperties + 
         ". Use format like: 'spellcheck=false; placeholder=Write something here...'"); 
      map.put(pair[0].trim(), pair[1]); 
     } 
     return map; 
    } 

} 

UI粘結劑的xml:

<p2:MultiLineTextArea ui:field="taMultiLine" styleName="form-control muliLine" 
      moreProperties="spellcheck=false; placeholder=Write something here... " /> 

結果HTML:

<textarea class="form-control muliLine" spellcheck="false" placeholder="Write something here..."></textarea> 
1

我會去與一個UI框架,做這一切爲你(及以上)。

我在我所有的項目中使用GWT-引導3和很樂意看:https://github.com/gwtbootstrap3/gwtbootstrap3

如果你不知道的引導,最好是快速通過一本書bootstrap3的走,所以你現在怎麼樣網格系統和其他東西的作品。當你使用gwt-bootstrap 3時,你會頭痛不已。

另一個你可以看看的是https://github.com/GwtMaterialDesign/gwt-material這是Google Material的封裝。我自己並沒有使用它,但我認爲這不是一個錯誤的選擇。

+0

placeHolder自帶GWT材質。 –

相關問題