Jak ustawić autouzupełnianie = "off" w vaadinie

Question

Czy jest możliwe ustawienie atrybutu HTML5 autocomplete="off" na TextField w Vaadin 7? Szukałem, ale nie znalazłem sposobu na ustawienie atrybutów w polach tekstowych lub po prostu podpowiedź w przeglądarce, aby wyłączyć natywne autouzupełnianie na polach wejściowych w inny sposób w vaadin.

Answer 1

myślę, że jedynym sposobem, jeśli używasz javascript:

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

Answer 2

przedłużyć TextField ...

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

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

... i - co jest kluczowym punktemtutaj - jego client- boczne Złącze

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; 
    } 

} 

Nie zapomnij ponownie skompilować zestawu widżetów.

Answer 3

Jeśli używasz Viritin add-on, możesz teraz użyć klasy HtmlElementPropertySetter, aby owinąć komponent TextField i użyć go, aby ustawić właściwość elementu "autouzupełniania" na "wyłączone". Można również użyć komponentu MTextField że pochodzi z Viritin i po prostu go utworzyć w następujący sposób:

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

Answer 4

Jest to rozszerzenie do @Wojciech odpowiedź Marciniak. Jego podejście zadziałało dla mnie, ale chciałbym zauważyć parę lub trzy modyfikacje, które musiałem zrobić, aby działał od 2017/11/28.

1) autocomplete="off" nie wydają się już działać w dzisiejszych czasach; przynajmniej nie w Chrome. Zamiast tego możesz użyć funkcji autocomplete="new-password", która działa w 64-bitowych 64-bitowych systemach Windows 62.0.3202.94. Zauważyłem też niespójne zachowanie tego atrybutu, ponieważ NOT zawsze działa - czasami na komponencie pojawi się lista z opcjami haseł (szczególnie, dopóki nie odświeżysz się kilka razy, itp.).

2a) Zamiast rozszerzenie komponentu, może chcesz zastąpić go tworząc pakiet com.vaadin.client.ui.(component)field w projekcie, a następnie umieścić zmodyfikowany (component)FieldConnector.java plik w nim (w moim przypadku było zmodyfikowanie PasswordField) w przypadku, gdy chcesz wszystkie Twoje wystąpienia tego składnika, aby nie pamiętać haseł. Ostateczne źródło klasa powinna wyglądać następująco:

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; 
    } 
} 

Więc ten sposób nie trzeba żadnej innej klasy TextField rozciągający (lub PasswordField).

2b) Jeśli chcesz zezwolić niektórym polom na zapamiętywanie haseł i innych, które go nie zawierają, możesz odpowiednio rozszerzyć komponent i użyć preferowanego komponentu. Możesz zachować klasę konektorów jak w 2a), ale pamiętaj, aby nazwać ją czymś w rodzaju CustomPasswordFieldConnector, a także powinieneś to zrobić pod @Connect z tą klasą CustomPasswordField.class, umieść ją tam, gdzie mieści się ona w twoim projekcie i pamiętaj, aby dodać do niej właściwą import złącze w razie potrzeby. Ta klasa jest po prostu sztuczna - możesz zostawić jej zawartość pustą na wypadek, gdybyś nie potrzebował dodatkowej funkcjonalności (ale pamiętaj, że powinna ona w tym przykładzie wydłużyć poprawne (component)Field; PasswordField).