1234567891011121314151617181920212223242526272829303132333435363738394041424344454647 |
- ---
- title: PasswordField
- order: 11
- layout: page
- ---
-
- [[components.passwordfield]]
- = PasswordField
-
- ifdef::web[]
- [.sampler]
- image:{live-demo-image}[alt="Live Demo", link="http://demo.vaadin.com/sampler/#ui/data-input/text-input/password-field"]
- endif::web[]
-
- The [classname]#PasswordField# is a variant of [classname]#TextField# that hides
- the typed input from visual inspection.
-
-
- [source, java]
- ----
- PasswordField tf = new PasswordField("Keep it secret");
- ----
-
- The result is shown in <<figure.components.passwordfield.basic>>.
-
- [[figure.components.passwordfield.basic]]
- .[classname]#PasswordField#
- image::img/passwordfield-basic.png[width=40%, scaledwidth=50%]
-
- You should note that the [classname]#PasswordField# hides the input only from
- "over the shoulder" visual observation. Unless the server connection is
- encrypted with a secure connection, such as HTTPS, the input is transmitted in
- clear text and may be intercepted by anyone with low-level access to the
- network. Also phishing attacks that intercept the input in the browser may be
- possible by exploiting JavaScript execution security holes in the browser.
-
- [[components.passwordfield.css]]
- == CSS Style Rules
-
- [source, css]
- ----
- .v-textfield { }
- ----
-
- The [classname]#PasswordField# does not have its own CSS style name but uses the
- same [literal]#++v-textfield++# style as the regular [classname]#TextField#. See
- <<components-textfield#components.textfield.css,"CSS Style Rules">> for information on styling it.
|