I am trying to spread the radio buttons using tomahawk selectOneRadio. My id looks like this
<rich:dataTable id="carTable" value="#{cars}" var="car">
<rich:column>
<s:decorate id="types" template="/layout/display-text.xhtml">
<t:selectOneRadio id="models" value="#{car.model}" layout="spread">
<f:selectItems value="#{models}" />
</t:selectOneRadio>
<h:panelGrid columns="2">
<a:repeat value="#{models}" rowKeyVar="index">
<t:radio for="car:carTable:0:types:models" index="#{index}"></t:radio>
</a:repeat>
</h:panelGrid> -->
</s:decorate>
</rich:column>
</rich:dataTable>
I referred id after inspecting an element. But this is not working. Because for each iteration radio button id varies. How to refer an id in t:radio
The documentation for t:radio says:
The id of the referenced extended selectOneRadio component. This value is resolved to the particular component using the standard UIComponent.findComponent() searching algorithm.
I'm guessing a:repeat is a NamingContainer, so using "models" won't work. You can use the client identifier of the t:selectOneRadio component.
Something like this:
<t:selectOneRadio id="models" value="#{car.model}" layout="spread"
binding="#{requestScope.modelComponent}">
<f:selectItems value="#{models}" />
</t:selectOneRadio>
<h:panelGrid columns="2">
<a:repeat value="#{models}" rowKeyVar="index">
<t:radio for="#{requestScope.modelComponent.clientId}" index="#{index}" />
</a:repeat>
</h:panelGrid>
Caveats:
This binds the component to the request scope map using the key "modelComponent"; you need to ensure this doesn't collide with something else
Resolving modelComponent.clientId requires JSF 2.0 (JEE6) or above
See here for more details; working with older versions; etc.
Related
I have a rich:modal panel (code below). I want to pass the #{currentLeg} to the method called in action="#{legHandler.assignAndInitLoadPlanning}. But when I debug, at the method legHandler.assignAndInitLoadPlanning, resolveVariable("currentLeg"); returns an object with all its attribute values equal to null. It's attributes should not be null.
Additionally, this rich:modal is called from an a4j:commandLink onclick="showUnitDialog(); on the same jsp file. If I change this said onclick to onclick="#{legHandler.assignAndInitLoadPlanning}" the currentleg will be passed properly but i cannot do this because i need to have a popup (which is a rich:modalpanel) to display. And I am using JSF 1.
I've already tried keep alive and set variable but still not works. It seems that the currentLeg is not properly passed. Do you have any idea why?
<rich:modalPanel id="unitDialog" width="400" height="100">
<f:facet name="header">
<h:panelGroup>
<h:outputText value="Please Select Unit for the Leg"></h:outputText>
<h:outputText value="#{currentLeg.legId}"></h:outputText>
</h:panelGroup>
</f:facet>
<h:panelGrid width="100%" columns="2" columnClasses="colStyle1, colStyle2">
<h:selectOneRadio value="legHandler.unit">
<f:selectItem itemValue="kg" itemLabel="kg" />
<f:selectItem itemValue="lb" itemLabel="lb" />
</h:selectOneRadio>
</h:panelGrid>
<h:panelGrid style="text-align: center" columns="3"
columnClasses="col1, col2" width="100%">
<a4j:commandButton value="Apply" styleClass="big_btn"
id="applyButton" immediate="true"
action="#{legHandler.assignAndInitLoadPlanning}"
oncomplete="{#{rich:component('unitDialog')}.hide();}">
</a4j:commandButton>
<a4j:commandButton value="Cancel" styleClass="big_btn"
immediate="true"
id="closeUnitPopupDialog"
onclick="#{rich:component('unitDialog')}.hide();"/>
</h:panelGrid>
</rich:modalPanel>
If you're using EL 2.2+ you can simply pass the value as parameter:
<a4j:commandButton action="#{legHandler.assignAndInitLoadPlanning(currentLeg)}" … />
Otherwise use a4j:actionparam and save the value to the bean
<a4j:commandButton …>
<a4j:actionparam name="currentLeg" value="#{currentLeg}" assignTo="#{legHandler.currentLeg}" />
<a4j:commandButton>
I've added OmniFaces to my Primefaces application primarily for being able to update a single row of a dataTable. I'm calling Ajax.updateColumn(dataTable, 1) on push event, but nothing gets updated. Eg. one of my cells is like this
<p:column style="width:40px;text-align: center;"
toggleable="false" styleClass="smallPadding unmarkable">
<f:facet name="header">
<p:commandLink styleClass="ui-icon ui-icon-car"
style="display: inline-flex;" id="carIcon" />
</f:facet>
<p:tooltip for="carIcon" value="Anzahl freie Fahrzeuge" />
<h:outputText
value="#{editLoad.getAmountOfUnusedOrderPositions(order)}" />
<h:outputText value="/#{order.orderPositions.size()}" />
</p:column>
I've debugged and #{editLoad.getAmountOfUnusedOrderPositions(order))} returns 0, but the wrong value (8) is displayed after the update.
From the Ajax#updateColumn() javadoc:
public static void updateColumn(UIData table, int index)
...
Note that the to-be-updated direct child of UIColumn must be a fullworthy JSF UI component which renders a concrete HTML element to the output, so that JS/ajax can update it. So if you have due to design restrictions for example a <h:panelGroup rendered="..."> without an ID, then you should give it an ID. This way it will render a <span id="..."> which is updateable by JS/ajax.
Your <h:outputText> of interest doesn't have a id. Give it one.
<h:outputText id="amountOfUnusedOrderPositions"
value="#{editLoad.getAmountOfUnusedOrderPositions(order)}" />
I want to pass the "title" parameter in the following listing dynamicaly to another jsf Facelet, depending on the selection of the selectOneMenu. My first approach looks like this:
<h:form id="form">
<p:selectOneMenu value="#{exerciseEditorBean.selectedExerciseType}" >
<f:selectItem itemLabel="Multiple Choice Exercise" itemValue="MultipleChoiceExercise" />
<f:selectItem itemLabel="Vocabulary Test" itemValue="VocabularyTest" />
</p:selectOneMenu>
<h:outputText value="Enter Title of your Exercise: " />
<h:inputText id="title" value="#{exerciseEditorBean.exerciseTitle}" />
<h:commandButton value="Next" action="#{exerciseEditorBean.openEditor()}" />
</h:form>
The ExerciseEditorBean is ViewScoped.
The openEditor() function then decides by the selectedExerciseType attribute which Facelet to show next and returns something like "multipleChoiceEditor.xhtml".
How can I now pass the titel attribute to this Facelet?
I now use the f:ViewParam in the target servelet, which works well except, that "multipleChoiceEditor.xhtml?includeViewParams=true" does not work, but this is another issue. Thanks for the discussion!
<h:form id="form">
<p:messages />
<p:panel header="Análise">
<h:outputText value="Mês da análise: " />
<p:selectOneMenu value="#{report005.selectedMes}">
<f:selectItems var="data" value="#{report005.analiseMeses}" itemLabel="#{report005.formataDataCombo(data)}" />
<f:convertDateTime pattern="MM/yyyy" />
</p:selectOneMenu>
<p:commandButton value="Análises" update="analiseTable" actionListener="#{report005.loadAnalise()}" />
<p:dataTable id="analiseTable" var="pes" value="#{report005.analiseModel}" selection="#{report005.selectedAnalise}" emptyMessage="Não há registros...">
<p:column selectionMode="multiple" style="width:18px" />
<p:ajax event="rowSelectCheckbox" listener="#{report005.loadAnaliseProduto()}" update="produtosmanycheck" />
<p:column headerText="Código">
#{pes.cod_analise}
</p:column>
<p:column headerText="Nome">
#{pes.dsc_analise}
</p:column>
<p:column headerText="Descrição">
#{pes.dsc_resumida_acao}
</p:column>
<p:column headerText="Planejamento">
<h:outputText value="#{pes.dat_planejamento_analise}">
<f:convertDateTime pattern="dd/MM/yyyy" />
</h:outputText>
</p:column>
</p:dataTable>
</p:panel>
<p:panel header="Produto Gerencial">
<p:selectManyCheckbox id="produtosmanycheck" value="#{report005.selectedProduto}" layout="pageDirection">
<f:selectItems id="teste" value="#{report005.produtos}" />
</p:selectManyCheckbox>
</p:panel>
<p:commandButton value="Enviar" action="#{report005.send}" ajax="false" />
</h:form>
Whan the AJAX event "rowSelectCheckbox" is fired, it does not find the 'produtosmanycheck' component to update, returning the following error to me:
javax.faces.FacesException: Cannot find component with identifier
"produtosmanycheck" referenced from "form:analiseTable". at
org.primefaces.util.ComponentUtils.findClientIds(ComponentUtils.java:251)
at
org.primefaces.util.AjaxRequestBuilder.addIds(AjaxRequestBuilder.java:102)
at
org.primefaces.util.AjaxRequestBuilder.update(AjaxRequestBuilder.java:90)
I already tried= :form:produtosmanycheck, form:produtosmanycheck, :produtosmanycheck, produtosmanycheck
I tried removing the FORM id too... without success...
What am I doing wrong? I can't update any component but the DataTable...
You can reach that produtosmanycheck using :form:produtosmanycheck
EDIT: Nested forms will not work properly and give all kinds of DOM issues like the one you're experiencing. Work out a way to separate your view components into separate forms and then try the above named access.
Have you tried putting the id "produtosmanycheck" on the parent p:panel element instead of on the p:selectManyCheckbox itself?
Form nesting should never be done in JSF even with prepend ID false as it will cause unexpected or no behaviour.
I will post my own answer (in the end I came up with nested forms idea) as well as voting up #kolossus because he was basically right and couldn't know about nested forms.
Nested forms aren't the "thing" of JSF only (as it may seem from #JordanDenison answer), it is a general rule of HTML --> nesting forms is forbidden in HTML !
You may want to read this nesting forms in HTML
I'm trying to have multiple h:forms on a page which are rendered with a ui:repeat component. If I have only one generated h:form, everything works perfect. If I have multiple h:forms, only the latest h:form will work! (If I try to submit another form then the last, only null is passed trough my service!)
<ui:repeat var="element" value="#{myService.elementList}">
<rich:simpleTogglePanel switchType="client"
label="#{element.codeElement} - #{element.description}"
opened="#{myService.isUiSelected(element)}"
onexpand="expand#{element.codeElement}()"
oncollapse="collapse#{element.codeElement}()">
<h:form id="newKindForm">
<a:commandLink ajaxSingle="true" id="idLink" onclick="#{rich:component('newTargetPanel')}.show()">
<a:commandButton id="myButton"
value="new Form"
action="#{myService.newForm(element)}"/>
</a:commandLink>
</h:form>
<rich:modalPanel id="newTargetPanel" autosized="true" width="450">
<f:facet name="header">
<h:outputText value="My Pannel Title" />
</f:facet>
<f:facet name="controls">
<h:panelGroup>
<h:graphicImage value="/img/close.png"
id="hidelink"
styleClass="hidelink" />
<rich:componentControl for="newTargetPanel"
attachTo="hidelink"
operation="hide"
event="onclick" />
</h:panelGroup>
</f:facet>
<!-- THIS IS THE PROBLEMATIC FORM -->
<h:form>
<a:include viewId="../myRepeatableForm.xhtml" />
</h:form>
</rich:modalPanel>
</ui:repeat>
Some suggestion?
Thank You
you can contain everything in a single form, and use execute attribute to submit only the elements you want. like this:
<h:form id="newKindForm" prependId="false">
<ui:repeat id="newKindRepeat" var="element"
value="#{myService.elementList}" varStatus="varStatus">
<h:panelGroup id="newKindPanel">
<a:commandButton id="myButton"
execute="newKindRepeat:#{varStatus.index}:newKindPanel"
onclick="#{rich:component('newTargetPanel')}.show()"
value="new Form"
action="#{myService.newForm(element)}"/>
</h:panelGroup>
</ui:repeat>
</h:form>
please notice prependId of h:form, id and varStatus of ui:repeat, execute of a:commandButton.
btw, supposing that a: stands for ajax4jsf, i wouldn't recommend using commandButton nested in commandLink.
Is #{myService.elementList} a List ? If so, I'm not sure if that will work. Try using javax.faces.model.DataModel instead. Be sure to read the documentation carefully. It works something like this:
public Datamodel getElements(){
if(elements == null)
elements = new ListDataModel(getElementList());
return elements;
}
public List<Element> getElementList(){
elementList = foo(); // load the elements in your List like you did before
return elementList;
}
in your view: <ui:repeat var="element" value="#{myService.elements}">
I'm not familiar with RichFaces, this is the only suggestion I can make.