I use jsf 1.2, richfaces 3.3.2 .
For some reason my suggestionbox submits the value i typed (a.k.a suggestion string) and not what i clicked in the suggested list that opens. How do i fix this?
<h:panelGroup>
<a4j:region renderRegionOnly="false" >
<h:panelGrid columns="2" border="0" cellpadding="0" cellspacing="0">
<h:inputText value="#{ManualReportControl.street}" id="streetNames" style="width:120px;" >
<a4j:support event="onchange" reRender="streetGis" ></a4j:support>
</h:inputText>
<h:graphicImage value="/images/icons/arrow.png"
onclick="#{rich:component('suggestionBoxStreet')}.callSuggestion(true)"
alt="" />
</h:panelGrid>
<rich:suggestionbox id="suggestionBoxStreet" for="streetNames"
suggestionAction="#{ManualReportControl.autocomplete}"
var="street"
minChars="2" >
<h:column>
<h:outputText value="#{street}" />
</h:column>
</rich:suggestionbox>
</a4j:region>
</h:panelGroup>
Got it!
I moved a4j:support from inputText to suggestionBox and now it works.
The code:
<h:panelGroup id="streetNames">
<a4j:region renderRegionOnly="false" >
<h:panelGrid columns="3" border="0" cellpadding="0" cellspacing="0">
<coral:inputString value="#{ManualReportControl.street}" id="streetName" style="width:120px;" tabindexreal="13"/>
<h:graphicImage value="/images/icons/arrow.png"
onclick="#{rich:component('suggestionBoxStreet')}.callSuggestion(true)"
alt="" />
</h:panelGrid>
<rich:suggestionbox id="suggestionBoxStreet" for="streetName"
suggestionAction="#{ManualReportControl.autocomplete}"
var="street"
minChars="2" selfRendered="true" >
<h:column>
<h:outputText value="#{street}" />
</h:column>
<a4j:support event="onselect" reRender="streetGis" ></a4j:support>
</rich:suggestionbox>
</a4j:region>
</h:panelGroup>
Probably happening because onchange event is fired before the selection is made.
Related
http://icefaces-showcase.icesoft.org/showcase.jsf?grp=ace:dialog&exp=Server%20Initiated I am just trying to learn how to use this component. But unable to run this example. When I click the button nothing happens. Does anybody have any idea? There is no error message either.
<h:form>
<h:panelGroup style="display:block; text-align:center;">
<ace:pushButton id="show" value="Show Dialog"
type="button">
<ace:ajax execute="#none" render="#none"
onStart="ice.ace.instance('#{dialog.clientId}').show(); return false;"/>
</ace:pushButton>
</h:panelGroup>
</h:form>
<ace:dialog id="dialog" binding="#{dialog}"
header="A sample dialog overview example"
closable="false"
modal="true"
draggable="false"
showEffect="clip"
hideEffect="fade"
width="400">
<h:form id="inputForm">
<h:panelGrid columns="2" width="100%">
<h:outputLabel id="firstNameLabel" for="firstNameInputField" value="First Name:"/>
<ace:textEntry id="firstNameInputField"
value="#{dialogBean.firstName}" />
<h:outputLabel id="lastNameLabel" for="lastNameInputField" value="Last Name:"/>
<ace:textEntry id="lastNameInputField"
value="#{dialogBean.lastName}"/>
</h:panelGrid>
<h:panelGrid width="100%" style="text-align: center;">
<ace:pushButton id="submitBtn"
value="Click me once done with input">
<ace:ajax execute="#form" render="#all"
onSuccess="ice.ace.instance('#{dialog.clientId}').hide(); "/>
</ace:pushButton>
</h:panelGrid>
</h:form>
</ace:dialog>
<h:form id="outputForm">
<h:panelGrid id="outputPanel" columns="2">
<h:outputLabel value="Entered text: " for="enteredName"/>
<h:outputText id="enteredName" value="#{dialogBean.firstName} #{dialogBean.lastName}"/>
</h:panelGrid>
</h:form>
This is the client side code from the example.
<h:form prependId="false">
<h:commandButton id="show" value="Show Dialog" onclick="ice.ace.instance('myDialog').show();" type="button"/>
<ace:dialog id="myDialog"
header="A sample dialog overview example"
width="400">
<h:outputText value="i will fix this"/>
</ace:dialog>
</h:form>
I was able to find the solution to the problem. One of the key problem was that I was suppose to use prependId="false" with form. so now the basic functionality works and on button click the ace:dialog appears.
The underlying code makes the look of two column table while there are four panelGroup's.
<h:panelGrid id="panel" columns="4" border="1" cellpadding="0" cellspacing="2">
<h:panelGroup><h:outputText value="#{ph.currentProduct.brand} #{ph.currentProduct.model}"/>
</h:panelGroup>
<h:panelGroup><h:outputText value="#{ph.currentProduct.price} грн"/>
</h:panelGroup>
<h:panelGroup>
Наличие:
<p:rating id="present" value="#{ph.currentProduct.present}" readonly="true" />
<p:tooltip for="present" value="test" />
</h:panelGroup>
<h:panelGroup>
<h:form id="buy_button" style="">
<h:inputHidden value="#{ph.productId}" />
<h:commandButton image="images/buy.png" action="#{ph.addToCart}" />
</h:form>
</h:panelGroup>
</h:panelGrid>
Why is it?
When I attach rich:tooltip element to any element of the screen of rich:popupPanel, it shows nothing. How can I solve this problem?
<rich:popupPanel id="balancePopup" width="800" resizeable="false"
rendered="true" autosized="true" modal="true"domElementAttachment="body">
<a4j:outputPanel id="balancePanelRegion">
<ui:include src="popup.xhtml" />
</a4j:outputPanel>
</rich:popupPanel>
This doesn't work (popup.xhtml)
<h:inputText value=""
id="my" styleClass="input-medium" readonly="true">
<rich:tooltip id="tooltip"><span>Hint</span></rich:tooltip>
</h:inputText>
Increasing z-index of tooltip component solved the problem:
<rich:tooltip id="tooltip3" style="z-index:10000;">Tooltip</rich:tooltip>
Move rich:tooltip outside:
<h:outputText value="Test"/>
<h:panelGroup id="inputWithTooltip">
<h:inputText />
<rich:tooltip mode="client" layout="block">
<h:outputText value="#{msg.info}" escape="false"/>
</rich:tooltip>
</h:panelGroup>
I'm creating a dynamic form with radio buttons in front of each rows that need to update a cart when a different row is selected :
<t:inputText id="test">
<f:ajax event="click" onevent="alert('3');" />
</t:inputText>
<t:selectOneRadio id="rbtnQuantity" value="#{orderActions.selectedQuantity}" layout="spread">
<f:selectItems value="#{orderActions.quantities}" var="item" />
<f:converter converterId="integerConverter" />
<a4j:ajax event="click" oncomplete="renderPrices();" />
</t:selectOneRadio>
<rich:dataTable id="tblQuantities" styleClass="quantities" value="#{orderActions.formatQuantityPrices}" var="item" rowKeyVar="row">
<h:column>
<t:radio id="rbtnQuantity" for=":form:rbtnQuantity" index="#{row}" />
</h:column>
<h:column>
<h:outputText value="#{item.quantity}" />
</h:column>
<h:column>
<h:outputText value="#{item.price}">
<f:convertNumber type="currency" currencySymbol="$" />
</h:outputText>
</h:column>
<h:column>
<h:outputText value="#{item.price / item.quantity}">
<f:convertNumber type="currency" currencySymbol="$" />
</h:outputText>/u
</h:column>
</rich:dataTable>
The problem is that no radio button fire the ajax event, even no javascript code is rendered in the resuling code :
<table id="form:tblQuantities" class="rf-dt quantities">
<colgroup span="4">
</colgroup>
<tbody id="form:tblQuantities:tb" class="rf-dt-b">
<tr id="form:tblQuantities:0" class="rf-dt-r rf-dt-fst-r">
<td id="form:tblQuantities:0:j_idt296" class="rf-dt-c">
<label><input id="form:tblQuantities:0:rbtnQuantity" type="radio" name="form:rbtnQuantity" checked="checked" value="25" /> 25</label>
</td>
<td id="form:tblQuantities:0:j_idt297" class="rf-dt-c">25</td>
<td id="form:tblQuantities:0:j_idt309" class="rf-dt-c">118,75 $</td>
<td id="form:tblQuantities:0:j_idt310" class="rf-dt-c">4,75 $/u</td>
</tr>
[more similar rows...]
I've also included one t:inputText at top, see if it was the t:selectOneRadio usage that was the problem but no.
I'm using Mojarra, RichFaces 4.2.1, Tomahawk 1.1.14.
Since I've not been able to use a4j:ajax or f:ajax with t:selectOneRadio, I've used this workaround :
<a4j:jsFunction name="changeQuantity" oncomplete="renderPrices();">
<a4j:param assignTo="#{orderActions.selectedQuantity}" name="quantity" />
</a4j:jsFunction>
<t:selectOneRadio onclick="quantity = jQuery(this).val();changeQuantity(quantity);" id="rbtnQuantity" value="#{orderActions.selectedQuantity}" layout="spread">
<f:selectItems value="#{orderActions.quantities}" var="item" />
<f:converter converterId="integerConverter" />
</t:selectOneRadio>
It is working properly, but I would prefer to fix the problem if ever someone find the right solution or I.
EDIT :
Here is the final used code :
<a4j:jsFunction name="changeQuantity" oncomplete="renderPrices();">
<a4j:param assignTo="#{orderActions.selectedQuantity}" name="quantity" />
</a4j:jsFunction>
# Each row of the table :
<input type="radio" name="quantity" value="#{item.quantity}" checked="#{orderActions.selectedQuantity eq item.quantity ? 'checked' : ''}" onclick="changeQuantity(#{item.quantity});" />
I try to make draggable components and to do this I am based on this example:
http://livedemo.exadel.com/richfaces-demo/richfaces/dragSupport.jsf
and i started with this example but the component does not give any indication that is draggable:
<!---------------- Indicator -------->
<rich:dragIndicator id="indicator" />
<h:form>
<table border="0">
<tr>
<td valign="top"><rich:panel>
<rich:tree>
...
</rich:tree>
</rich:panel></td>
<td valign="top"><rich:panel id="afficherTest">
<rich:dataGrid value="#{afficherTestBean.listTest}" var="test"
columns="2" elements="6" width="600px">
<rich:panel style="cursor: move">
<!---------------draggable Zone-------------------->
<rich:dragSupport dragIndicator=":indicator"
dragType="#{test.nomTest}" dragValue="#{test.nomTest}">
<rich:dndParam name="label" value="#{test.nomTest}" />
</rich:dragSupport>
<f:facet name="header">
<h:outputText value="#{test.categorie}"></h:outputText>
</f:facet>
<h:panelGrid columns="2">
<h:outputText value="Nom Test:" styleClass="label"></h:outputText>
<h:outputText value="#{test.nomTest}" />
<h:outputText value="Description Test:" styleClass="label"></h:outputText>
<h:outputText value="{test.description}" />
<a4j:commandLink value="Ajouter"></a4j:commandLink>
</h:panelGrid>
</rich:panel>
<f:facet name="footer">
<rich:datascroller></rich:datascroller>
</f:facet>
</rich:dataGrid>
</rich:panel></td>
</tr>
</table>
</h:form>
</html>
please help me to create draggable component,i need your help ):'