jsf - f:ajax render does not update components anymore -
i have datatable , load modal edit data. when edit , render datatable nothing changed.
i mean have datatable , actions delete , edit. when press on edit open modal edit data on modal press edit. see make render datatable can't see changes in datatable
<h:form id="branchesform"> <h:panelgroup layout="block" class="box-header"> <h3 class="box-title">branches</h3> <h:commandbutton value="add new branch" id="createbranchbtn" pt:data-loading-text="loading..." pt:autocomplete="off" class="btn btn-primary sye-action-btn-loading"> <f:param name="pagetype" value="create"/> </h:commandbutton> </h:panelgroup> <h:panelgroup layout="block" class="box-body table-responsive no-padding branches-datatable"> <div class="sye-modal"> </div> <h:panelgroup id="brancheslistdiv" layout="block" class="container-fluid"> <h:datatable id="example1" binding="#{index}" class="table table-hover table-bordered table-striped" value="#{branchesmb.list}" var="branch"> <h:column> <f:facet name="header" > <h:outputtext value="#"/> </f:facet> <h:outputtext value="#{index.rowindex+1}"/> <f:facet name="footer" > <b><h:outputtext value="#"/></b> </f:facet> </h:column> <h:column > <f:facet name="header"> <h:outputtext value="branch name"/> </f:facet> <h:outputtext value="#{branch.branchname}"/> <f:facet name="footer"> <b><h:outputtext value="branch name"/></b> </f:facet> </h:column> <h:column> <f:facet name="header"> <h:outputtext value="address"/> </f:facet> <h:outputtext value="#{branch.branchaddress}"/> <f:facet name="footer"> <b><h:outputtext value="address"/></b> </f:facet> </h:column> <h:column> <f:facet name="header"> <h:outputtext value="abbreviation"/> </f:facet> <h:outputtext value="#{branch.branchabbreviation}"/> <f:facet name="footer"> <b><h:outputtext value="abbreviation"/></b> </f:facet> </h:column> <h:column headerclass="syeactiondatatable"> <f:facet name="header"> <h:outputtext value="action"/> </f:facet> <f:facet name="footer"> <b><h:outputtext value="action"/></b> </f:facet> <div class="btn-group" > <a class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown" href="#"> <i class="glyphicon glyphicon-cog"></i> <span class="caret"></span> </a> <ul class='dropdown-menu pull-right'> <li> <!--pt:data-toggle="modal" pt:data-target=".bs-example-modal-lg"--> <h:commandlink actionlistener="#{branchesmb.setentityeditobject(branch)}" class="editdatatable" > <f:ajax onevent="load" onerror="load" render=":branchesform:brancheditarea"/> <i class='glyphicon glyphicon-pencil'></i> edit </h:commandlink> </li> <li> <!--onclick="if (!confirm('are sure want delete record?')) return false"--> <h:commandlink action="#{branchesmb.destroy()}" onclick="if (!confirm('are sure want delete record?')) return false;"> <f:ajax render=":branchesform:brancheditarea"/> <f:setpropertyactionlistener target="#{branchesmb.entitydeleteobject}" value="#{branch}"/> <i class='glyphicon glyphicon-trash'></i> delete </h:commandlink> </li> </ul> </div> </h:column> </h:datatable> <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="mylargemodallabel"> <div class="modal-dialog modal-lg"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="close"><span aria-hidden="true">×</span></button> <h4 class="modal-title" id="mymodallabel">edit branch</h4> </div> <div class="modal-body"> <h:panelgroup id="brancheditarea" layout="block" class="box-body"> <ui:include src="/view/includes/messages.xhtml"/> <h:inputhidden value="#{branchesmb.entityeditobject}" converter="branchesconverter"/> <h:panelgroup id="branchnamediv" layout="block" class="form-group"> <h:outputlabel value="branch name" for="branchname"/> <h:inputtext id="branchname" class="form-control" value="#{branchesmb.entityeditobject.branchname}" /> </h:panelgroup> <h:panelgroup id="branchaddressdiv" layout="block" class="form-group"> <h:outputlabel value="branch address" for="branchaddress"/> <h:inputtext id="branchaddress" class="form-control" value="#{branchesmb.entityeditobject.branchaddress}"/> </h:panelgroup> <h:panelgroup id="branchabbreviationdiv" layout="block" class="form-group"> <h:outputlabel value="abbreviation" for="branchabbreviation"/> <h:inputtext id="branchabbreviation" class="form-control" value="#{branchesmb.entityeditobject.branchabbreviation}"/> </h:panelgroup> </h:panelgroup> </div> <div class="modal-footer"> <!--pt:data-dismiss="modal"--> <h:commandbutton id="close" value="close" class="btn btn-default" > <f:ajax render="branchesform:brancheslistdiv"/> </h:commandbutton> <h:commandbutton id="edit" value="edit" action="#{branchesmb.update()}" class="btn btn-primary sye-action-btn-loading" pt:data-loading-text="loading..." pt:autocomplete="off"> <f:ajax render=":branchesform:brancheslistdiv,:branchesform:brancheditarea, @this" execute="brancheditarea branchesform:brancheslistdiv"/> </h:commandbutton> <!-- <button type="button" class="btn btn-default" data-dismiss="modal">close</button> <button type="button" class="btn btn-primary">save changes</button>--> </div> </div> </div> </div> </h:panelgroup> </h:panelgroup> <h:panelgroup layout="block" class="box-footer"> branches </h:panelgroup> </h:form>
the mistake here:
<f:ajax render=":branchesform:brancheslistdiv,:branchesform:brancheditarea, @this" ... /> the render , execute attributes of <f:ajax> space separated, not comma separated.
<f:ajax render=":branchesform:brancheslistdiv :branchesform:brancheditarea @this" ... /> normally, should have thrown exception detailed in q&a how find out client id of component ajax update/render? cannot find component expression "foo" referenced "bar", since mojarra 2.2.5 stopped validating attributes in order support referencing specific <ui:repeat> iteration round (issue-2958). spec issue 1372 started address nasty quickfix , bring validation.
the comma separation supported in primefaces <p:ajax> , confusion came from. supports both space , comma separation. it's recommended not use comma separation in <p:ajax> it's in long term confusing when come <f:ajax>.
Comments
Post a Comment