2014-11-03 80 views
5

是否可以在TextField上設置HTML5屬性autocomplete="off"Vaadin 7? 我已經搜索,但沒有找到方法來設置文本字段的屬性,或者只是提示瀏覽器禁用輸入字段上的本地自動完成在一些其他方式在vaadin。如何在vaadin中設置autocomplete =「off」

回答

5

我認爲唯一的方式,如果你用javascript:

TextField tf = new TextField(); 
tf.addStyleName("xyz"); 
JavaScript.getCurrent().execute(
    "document.getElementsByClassName('xyz')[0].setAttribute('autocomplete', 'off')"); 
2

擴展TextField的...

package com.example; 
import com.vaadin.ui.TextField; 

public class MyTextField extends TextField { 
    // do other customization here as needed 
} 

...和 ​​- 有什麼關鍵點在這裏 - 它的客戶端 - 側連接器

package com.example.client; 

import com.vaadin.client.ui.VTextField; 
import com.vaadin.client.ui.textfield.TextFieldConnector; 
import com.vaadin.shared.ui.Connect; 

@Connect(com.example.MyTextField.class) 
public class MyTextFieldConnector extends TextFieldConnector { 

    @Override 
    public VTextField getWidget() { 
     VTextField vTextField = super.getWidget(); 
     vTextField.getElement().setAttribute("autocomplete","off"); 
     return vTextField; 
    } 

} 

不要忘記重新編譯小部件集。

+0

我不再在Vaadin項目上工作,以確認它是否有效。如果有第三方確認,我會將此答案設置爲接受,因爲這是我在Java中首選的方式,而不是使用JavaScript – 2016-01-06 13:31:23

2

如果您使用Viritin add-on,現在可以使用HtmlElementPropertySetter類來包裝TextField組件,並使用它將「autocomplete」元素屬性設置爲「off」。你也可以使用自帶的Viritin的mTextField中成分,只是創建如下:

MTextField username = new MTextField("Username") 
     .withAutocompleteOff(); 
0

這是一個擴展到@Wojciech Marciniak的答案。他的方法對我很有幫助,但爲了讓它在2017年11月28日之前能夠正常工作,我需要做一兩次或三次修改。

1)autocomplete="off"似乎沒有了時下工作;至少不是在Chrome上。相反,您可以使用autocomplete="new-password",它適用於Chrome 62.0.3202.94 Windows 64位。我還注意到這個屬性有一些不一致的行爲,因爲不總是有效的 - 有時候組件上會顯示帶有密碼選項的列表(特別是直到刷新了幾次,等等)。

2A)而不是延長分量的,您可能希望通過在項目中創建com.vaadin.client.ui.(component)field包覆蓋它,然後把修改後的(component)FieldConnector.java文件中它(在我的情況,我修改PasswordField)的情況下,你希望所有此組件的實例不記住密碼。最終的類源代碼應如下所示:

package com.vaadin.client.ui.passwordfield; 

import com.vaadin.client.ui.VPasswordField; 
import com.vaadin.client.ui.textfield.TextFieldConnector; 
import com.vaadin.shared.ui.Connect; 
import com.vaadin.ui.PasswordField; 

@Connect(PasswordField.class) 
public class PasswordFieldConnector extends TextFieldConnector { 

    @Override 
    public VPasswordField getWidget() { 
     VPasswordField vTextField = (VPasswordField) super.getWidget(); 
     vTextField.getElement().setAttribute("autocomplete","new-password"); 
     return vTextField; 
    } 
} 

因此,這種方式不需要任何其他類擴展TextField(或PasswordField)。

2B)如果你想允許某些領域記住密碼和其他不,你可以擴展組件,並相應地使用你的首選組件。你可以把你的連接器類爲2A),但記得來命名它像CustomPasswordFieldConnector,也應該@Connect與CustomPasswordField.class,把那類無論在您的項目符合並記得添加適當的import它在連接器以防萬一需要。這個類只是一個虛擬的類 - 你可以保留它的內容爲空,以防你不需要任何額外的功能(但是記住它應該擴展適當的(component)Field; PasswordField在這個例子中)。

相關問題