My facelet code is as below,
<div class="notes_Innercontainer">
<div class="notes_Innercontainer2">
<div class="notes_headerBar">
<div class="notes_headerBar_col1">#{msgs.note_com_date_time}</div>
<div class="notes_headerBar_col2">#{msgs.note_com_view}</div>
</div>
<h:panelGroup id="notecomponent">
<div class="scrollArea">
<div class="scroll-pane" id="pane1">
<div class="notes_table">
<ui:repeat var="note" value="#{noteController.noteList}" varStatus="status">
<div class="notes_table_rw1">
<div class="notes_Rw_col1">#{note.createDate}</div>
<div class="notes_Rw_col2">
<h:commandButton image="resources/images/updateBtn.gif" class="tTip" value="Update1">
<f:ajax event="click" execute="#form" render="#all" listener="#{noteController.loadEditableNoteComponent}" onevent="note_popupopener"/>
<f:param value="#{note.noteTaskIdEdit}" name="noteTaskIdForEdit">
</f:param>
</h:commandButton>
</div>
</div>
</ui:repeat>
</div>
</div>
</div>
</h:panelGroup>
</div>
</div>
<div class="originator_ButtonContainer">
<h:commandButton image="resources/images/addNoteBtn.gif" border="0">
<f:ajax event="click" execute="notecomponent" render="notecomponent" listener="#{noteController.loadAddNotePopUp}" onevent="add_note_popupopener"/>
</h:commandButton>
</div>
When I use f:ajax for that "update" button (updateBtn) with options as execute="#form" render="#all" it works as ad-hoc way (mean some times scroll-pane not working), but my "add" button (addNoteBtn) function correctly with options execute="notecomponent" render="notecomponent" options. Is there any way to give me execute, render options for "update" button as that "add" button.
Thanks
Related
I am loading stuff via AJAX into my JSF page from the server. However, not all of the content is displayed immediately, two divs arent displayed until the page is refreshed.
Here's the form for loading the content:
<h:form>
<h:dataTable value="#{consoleController.list}" var="item">
<h:column>
<h:commandLink class="list-group-item"
action="#{consoleController.defineLink()}">#{item}
<f:setPropertyActionListener target="#{consoleController.content}"
value="#{item}" />
<f:ajax event="action" render="menuDiv contenDiv facetDiv"></f:ajax>
</h:commandLink>
</h:column>
</h:dataTable>
</h:form>
These are the elements I want to load the code into.
<div class="col-sm-12">
<div class="col-sm-4">
<h:panelGroup id="menuDiv">
<ui:include src="#{consoleController.loadMenu()}" />
</h:panelGroup>
</div>
<div class="col-sm-8">
<h:panelGroup id="contentDiv">
<ui:include src="#{consoleController.loadPage()}" />
</h:panelGroup>
</div>
</div>
<div class="col-sm-12">
<h:form>
<h:panelGroup id="facetDiv">
<ui:include src="#{consoleController.loadFacet()}" />
</h:panelGroup>
</h:form>
</div>
menuDiv is displayed fine, the other two aren't displayed until I refresh the page.
What's the problem here?
I read that you cannot upload elements that don't exist in the JSF tree, but that's not the case here.
Well, turns out it was as easy as removing the h:form tag around the last panel tag:
<div class="col-sm-12">
<h:form>
<h:panelGroup id="facetDiv">
<ui:include src="#{consoleController.loadFacet()}" />
</h:panelGroup>
</h:form>
</div>
becomes:
<div class="col-sm-12">
<h:panelGroup id="facetDiv">
<ui:include src="#{consoleController.loadFacet()}" />
</h:panelGroup>
</div>
and now it works.
I'm trying to show a dialog using a p:commandButton, the p:commandButton is inside a tabView. I tried this way but without sucess, am I missing something? Thx
<p:tab title="Observations">
<div class="field select-field clearfix">
<label>Bloc</label>
<h:panelGroup layout="block" styleClass="actions">
<h:form>
<p:commandButton value="Add" styleClass="add"
action="#{blocCtrl.initBlocSetting}"
update=":dialog2" oncomplete="add_bloc.show()">
</p:commandButton>
</h:form>
</h:panelGroup>
<p:dialog id="dialog2" header="Bloc" modal="true"
widgetVar="add_bloc" minHeight="40" width="895">
<div class="popup-body">
<h:form>
<h:panelGroup layout="block"
styleClass="popup-field clearfix last">
<label class="the-label">Type bloc*</label>
<div class="the-field">
<h:inputText
value="#{blocCtrl.blocSettings.type}"
required="true"
requiredMessage="Error" />
</div>
</h:panelGroup>
<div class="popup-actions">
<button
onclick="$('.ui-dialog-titlebar-close').trigger('click');return false;"
class="red-btn">Annuler</button>
<h:commandButton value="OK" type="submit"
action="#{blocCtrl.addBlocSetting}"
update="add_messagePanel"
oncomplete="if(args && args.success){add_bloc.hide();}"
styleClass="green-btn" />
</div>
</h:form>
</div>
</p:dialog>
</div>
I had the same situation and after removing form tag before p:tabView it started to work
<h:form>
<p:tabView>
<p:tab title="title">
<h:form>
<p:commandButton actionListener="... />
</h:form>
</p:tab>
</p:tabView>
</h:form>
I am opening a popup on click of command link, and popup has a textbox and commandLink
whenever I press submit with textbox left blank, it shows validation msg, till now this is fine. Now if I close the popup using cross icon on top right. then again click to showPopup, it show the error messages . I want to clear that messages and open fresh popup.
below is my code
<p:commandLink id="showDialogButton" styleClass="add_icon"
value="ADD" onstart="#{dashboardBean.resetFoodPromoDTO()}" oncomplete="PF('dlg').show()" />
bean
public void resetFoodPromoDTO(){
foodPromoDTO=null;
}
popup dialog
<p:dialog id="dialog" visible="#{not empty facesContext.messageList}" styleClass="customized" widgetVar="dlg" draggable="true" closable="true" resizable="false" width="730">
<div class="popup_subheader">
<div class="float_left">Add - Food Promotion Activity</div>
<div class="float_right"></div>
<div class="clear"></div>
</div>
<div class="popuptext">
<div class="form-label"><label title="Project">Project: </label></div>
<div class="form-field"><p:inputText id="projectName" value="#{dashboardBean.foodPromoDTO.project}" required="true" requiredMessage="#{msg['validation.project.name']}"/>
<p:message id="projeMsgId" for="projectName" autoUpdate="true"/>
</div>
<div class="clear"> </div>
<div class="form-label"><label title="Promo Date">Promo Date:</label></div>
<div class="btn_area_popup">
<span>
<p:commandLink id="submitButton" validateClient="true" value="Save" action="#{dashboardBean.addFoodPromotion()}" update="#form" onuccess="PF('dlg').hide();" ajax="true"/>
</span>
</div>
<div class="clear"></div>
You have to update the dialog
<p:dialog id="dialog" visible="#{not empty facesContext.messageList}" styleClass="customized" widgetVar="dlg" draggable="true" closable="true" resizable="false" width="730">
<h:form id="dialog">
<p:panel id="dialogBody">
....
</p:panel>
</h:form>
</p:dialog>
You can update dialog with this code:
<p:commandLink id="showDialogButton" styleClass="add_icon"
value="ADD" actionListener="#{dashboardBean.resetFoodPromoDTO()}" oncomplete="PF('dlg').show()" update=":dialog:dialogBody" />
You have to use actionListener.
I have a page with a logout button which is h:commandLink
<h:form>
<div id="top-nav">
<div id="logout" style="float: right; margin-left: 10px;">
<h:commandLink styleClass="top-nav-btn"
action="#{adminLogoutBean.logout}"
rendered="#{facesContext.externalContext.sessionMap['ccUserVO'] ne null}" value="Logout" immediate="true">
<f:ajax execute="#form" render="#none" />
</h:commandLink>
</div>
<div style="margin-left: -80px; margin-top: 70px;">
<p style="float: left;margin-left: 10px;">Please
enter client VIN or EMAIL</p>
<br />
<h:inputText styleClass="menus txfld_border_no_image required email"
minlength="5" style="width:300px;clear:right;display:inline;"
id="loginEmail" value="#{callCenterAdminBean.searchText}" />
<span class="btn-wrap" id="get_enabled"> <h:commandButton type="submit"
class="common_btn noprint submit" id="userlookup_btn" value="GET"
action="#{callCenterAdminBean.userLookup}">
</h:commandButton> </span>
<span class="btn-wrap" id="get_disabled" style="display:none"> <h:commandButton type="submit"
class="common_btn noprint submit" disabled='true' value="GET"
action="#{callCenterAdminBean.userLookup}">
</h:commandButton> </span>
</div>
</h:panelGroup>
</div>
</h:form>
When I click on Logout, I find the page refreshes first and then the action is called. Why does the page refresh? I want to call the bean method which will redirect to the login page using the navigation rules.
If you want to use the navigation you don't need the ajax , just remove the
<f:ajax execute="#form" render="#none" />
And remove the immediate="true" cause I don't see any reason for you to use it in the following use case...
I want to print one div with primefaces printer (primefaces 3.2 with myfaces 2.0).
My faces code is like:
<div id="page">
<!-- SIDEBAR -->
<div id="sidebar"
class="ui-widget-content ui-corner-all ui-helper-clearfix ui-shadow sidebar">
<ui:insert name="sidebar"></ui:insert>
<p:commandButton value="Print" type="button">
<p:printer target="content" />
</p:commandButton>
</div>
<!-- CONTENT -->
<div id="content">
<ui:insert name="content">...</ui:insert>
</div>
<div style="clear: both;"> </div>
</div>
But I get a FacesException:
javax.faces.FacesException: Cannot find component content in view.
Is this possible with primefaces printer or is there another way to do this.
Best Regards Veote
p:printer expects an id of the component, but ui:insert defines a logical section which is going to be inserted by the client. You could try to wrap the content you wish to print in p:outputPanel like so:
<p:outputPanel id="content">
<ui:insert name="content" />
</p:outputPanel>