CODEWITHSUNDEEP
jsfprimefaces
user2731899
user2731899

Reputation: 103

JSF Inplace - Save Value in focusOut

I need to save values on Focus out in Inplace JSF. Currently the editor tag can be used but it will display a save/cancel button. My requirement is to save the data on focus out.

This is the Inplace tag that i am using.

 <p:inplace id="basic">  
         <p:inputText value="Edit Me" />  
 </p:inplace>

Is there any ajax event like.

<p:ajax event="Something like focusOut" listener="#{bean.myFunction()}"/>

My Code sample when i use Blur as ajax event

<p:inplace label="#{serviceCalendarViewManagedBean.selectedService.statusStr}"  id="ajaxInplaceStatusEdit" >
<p:ajax event="blur" listener="#{serviceCalendarViewManagedBean.inplaceEdit('StatusEdit')}" update="view" oncomplete="scheduleWidget.update();"/>
<p:selectOneMenu id="statusEditImplace" required="true"
 value="#{serviceCalendarViewManagedBean.selectedService.status}"
 label="text">
<f:selectItems value="#{serviceCalendarViewManagedBean.serviceStatusList}"
 var="status" itemLabel="#{status.title}" itemValue="#{status.id}" />
</p:selectOneMenu>
</p:inplace>

The error message That i get when using this event 

    /WEB-INF/views/service/servicecalendarview.xhtml @886,153 <p:ajax>
 Event:blur is not supported.

Upvotes: 2

Views: 4139

Answers (1)

Luiggi Mendoza
Luiggi Mendoza

Reputation: 85779

You're looking for the onblur event:

Execute a JavaScript when a user leaves an input field:

JSF code:

<p:ajax event="blur" listener="#{bean.myFunction()}"/>

EDIT: from your posted code, the <p:ajax> affects the <p:inplace> where it should affect the <p:selectOneMenu>. Move the <p:ajax> inside the <p:selectOneMenu>:

<p:inplace label="#{serviceCalendarViewManagedBean.selectedService.statusStr}"
    id="ajaxInplaceStatusEdit" >
    <p:selectOneMenu id="statusEditImplace" required="true"
        value="#{serviceCalendarViewManagedBean.selectedService.status}"
        label="text">
        <f:selectItems value="#{serviceCalendarViewManagedBean.serviceStatusList}"
            var="status" itemLabel="#{status.title}" itemValue="#{status.id}" />
        <p:ajax event="blur" listener="#{serviceCalendarViewManagedBean.inplaceEdit('StatusEdit')}"
            update="view" oncomplete="scheduleWidget.update();"/>
    </p:selectOneMenu>
</p:inplace>

Upvotes: 1

Related Questions