在p:inputText中添加图标(例如材料设计或Prime图标) [英] Add icon (e.g. material design or Prime Icons) to a p:inputText

问题描述

我想在JavaEE项目中为输入文本元素添加图标:

I want to add an icon for an input text element, in a JavaEE project:

<h:panelGroup styleClass="md-inputfield">
    <p:inputText id="name"
                 value="#{createCustomerView.customer.name}" required="true"
                 label="Nome" requiredMessage="inserisci il nome">
        <f:validateLength minimum="2" />
    </p:inputText>
    <p:outputLabel for="name" value="Nome" />
    <p:message for="name" display="icon" />
</h:panelGroup>

如何添加图标，例如人物图标?

How Can add an icon, like a person icon?

推荐答案

您可以使用Primefaces输入组.请参阅 https://www.primefaces.org/showcase/ui/input/inputGroup .xhtml

You can make use of Primefaces input group. refer https://www.primefaces.org/showcase/ui/input/inputGroup.xhtml

<div class="ui-inputgroup">
  <span class="ui-inputgroup-addon"><i class="pi pi-user"></i></span>
  <p:inputText placeholder="Username" />      
</div>

但是不要忘记，您确实需要通过将PrimeIcons添加到您的h:head

But don't forget you do need to add the PrimeIcons by adding this to your h:head

(如 https://www.primefaces.org/showcase /ui/misc/primeicons.xhtml )

这篇关于在p:inputText中添加图标(例如材料设计或Prime图标)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！