How to use <p:watermark> for <p:inplace> editor

Question

I want to use <p:watermark> for a <p:inplace> editor. I tried it as below

<p:watermark for="txtSvcName" value="Please enter service name..." />
<p:inplace id="ipSvcName" editor="true" >                                   
    <p:inputText id="txtSvcName" value="#{service.serviceName}"  maxlength="50" 
     readonly="#{not subMerchantManagement.editPerspective}"    converter="UpperCaseConverter" />                                   
</p:inplace>

but unfortunately that doesn't work. How can I achieve this?

Answer 1

According to Primefaces Showcase, you have to call p:watermark via javascript when some event is happened. You have lots of events over p:inputText where you can make your call: onblur, onchange... Just call PrimeFaces.showWatermarks(); function when the one you need happens. You should take a look to Primefaces Documentation too, because there is another function to clean the Watermarks when you need it. Good luck.

EDITED

You can trigger an ajax event when user saves inplaced content. When that request is processed just call the show function and update the main container. I guess it will be useful.

<p:panel id="panel">
    <p:watermark for="txtSvcName" value="Please enter service name..." />
    <p:inplace id="ipSvcName" editor="true" emptyLabel="Please enter service name..." >                                   
        <p:inputText id="txtSvcName" value="#{service.serviceName}" maxlength="50" 
            readonly="#{not subMerchantManagement.editPerspective}"    converter="UpperCaseConverter" /> 
        <p:ajax event="save" listener="#{subMerchantManagement.handleSave}" 
            oncomplete="PrimeFaces.showWatermarks();" update="panel" />  
    </p:inplace>
</p:panel>