I have a date field in my jsp page where I have used apache trinidad.
I have written the following code for that
<tr:inputDate label="Date From" id="dateFrm" value="#{taskStatus.fromDate}" >
<f:convertDateTime pattern="dd-MM-yyyy"/>
</tr:inputDate>
<tr:outputLabel value="DD-MM-YYYY" inlineStyle="color:red; vertical-align:top">
</tr:outputLabel>
Now, the problem that I have is that whenever I enter an invalid date the error message is scattered all over the page and I get an extra calender icon! I want to override the element style for inputDate element.So ,that it does not show any error message(or the extra calender icon). I tried to use this to override element style
<tr:inputDate label="Date From" id="dateFrm" value="#{taskStatus.fromDate}" inlineStyle="display: inline !important" >
But it did not work either
I never have problems with the layout of error messages. I always put my input fields in tr:panelFormLayout tags, which could result in a more consistent layout for you.
Also I would suggest to use a help facet to show the date format. You can skin it using the selector .OraInlineInfoText.
<tr:panelFormLayout>
<tr:inputDate label="Date From"
id="dateFrm"
value="#{taskStatus.fromDate}">
<f:convertDateTime pattern="dd-MM-yyyy"/>
<f:facet name="help">
<tr:outputText value="DD-MM-YYYY"/>
</f:facet>
</tr:inputDate>
</tr:panelFormLayout>
Related
Primefaces (5.2, Mojarra 2.2.13) inside Dialog Framework is not opening a <p:confirm>-MessageBox.
I have delete icons in a datatable as a <p:commandLink> per row inside a Dialog.
I want to have a user confirmation to delete every row.
Following code works as expected in a <p:dialog> but not using Dialog Framework. Dialog Framework blocks the click on the delete icon or in other words: shows the confirm box invisible and answers NO.
<p:dataTable id="idTblMfc" value="#{bnMfcs.rows}" var="ORow" editable="true" ...>
... Columns ...
<p:column>
<p:commandLink styleClass="ui-icon ui-icon-trash" title="#{msg.TXT_DELETE}" actionListener="#{bnMfcs.doDelete(ORow)}" update="idTblMfc">
<p:confirm header="#{msg.TXT_DELETE}" message="#{msg.PRM_DEL_CONT_MARKED}" icon="ui-icon-alert" />
</p:commandLink>
</p:column>
I tried the same with <p:confirmDialog> instead of <p:confirm> with the same result. OK, I found the tiny difference that <p:confirmDialog> doesn't block the delete icon click but also does not appear.
The rest of the dialog and the datatable works as expected even with message boxen shown with showMessageInDialog(...).
Any ideas?
As you can see in the showcase (http://www.primefaces.org/showcase/ui/overlay/confirmDialog.xhtml), you need both p:confirm (where you need confirmation) and p:confirmDialog (which defines how the dialog looks like).
Also make sure that you are in a h:form tag.
Solution found!
The documentation makes not clear that <p:confirmDialog> is mandatory. I had one on my main page and the page using Dialog Framework had not.
For my inbox page, in this page user will be able to see messages, message will have 2 types of state ( Not yet started, In_progress)..
dataTable where user will be able to see all messages will have 3 columns:
Data, title, actions
State of messages comes from services. My task is, to add BOLDED word "NEW" to the title of every message that user hadn't opened yet.
After opening, state will change to "in_progress" and bolded word "NEW" should disapear.
Or there is idea insted of NEW to use some kind of icon.
What I have done so far is :
<p:column headerText="#{msg.title}">
<h:outputText value="#{task.properties.bpm_status=='Not Yet Started'?'New ':''}" />
<h:outputText value="#{task.properties.bpm_description}" />
</p:column>
Problem is, I can't correctly add <b></b> to bold it or to add icon instead.
I've tried to add <b></b> arround 'New' but I get error in that case.
try to use the following style in "style="font-weight:bold"" in h:outputText Tag
<h:outputText value="#{task.properties.bpm_status=='Not Yet Started'?'New ':''}" style="font-weight:bold" />
I tried it and it`s work for me
You can use <ui:fragment> to conditionally render template text.
<ui:fragment rendered="#{task.properties.bpm_status eq 'Not Yet Started'}">
<b>New</b>
</ui:fragment>
Alternatively, apply a style class.
<h:outputText value="New" styleClass="new" rendered="#{task.properties.bpm_status eq 'Not Yet Started'}" />
.new {
font-weight: bold;
}
Using inline styles via style attribute is poor practice as it isn't abstract/reusable.
I have a tabView component and in each tab panel, I have a form.
I have also a flag image to change locale in my application and when it's clicked, I want to reload all tabView with new locale changes.
In one form in a tab panel, I use captcha component and I don't want to reload it because...it's impossible without all reload page (doesn't support partial Ajax reloading, I will use Recaptcha.reload() JS to do the job of reloading).
So I want to reload all my tabView component nested in panel component named...panel without my captcha.
my tabView is nested in panel named panel
my captcha has id captcha
My 2 locale change buttons are these one :
<p:commandLink update="#(:panel:not(captcha))" rendered="#{locale.locale != 'fr'}">
<h:graphicImage url="resources/images/flags/flag_fr.png" width="30" height="30" />
<f:setPropertyActionListener target="#{locale.locale}" value="fr" />
</p:commandLink>
<p:commandLink update=":panel" rendered="#{locale.locale != 'en'}">
<h:graphicImage url="resources/images/flags/flag_en.png" width="30" height="30" />
<f:setPropertyActionListener target="#{locale.locale}" value="en" />
</p:commandLink>
I have tested much combinaisons of selectors inside update attribute but without success.
Any selector idea please ? Thanks a lot
When you are using PFS you are referencing client id of the componenets. For example if client id of your panel is :panel, your selector will be #(#\\:panel) (you have to escape semicolon). Inspect your generated html and find out real client ids of your components. If the component is in naming container id of container is concatenated before id of child compoenent. For example if panel is naming container of your captcha it would be something like: #(#\\:panel:not(#\\:panel\\:captcha)). Forms are also naming container so probably your ids will have something more near this.
Is it possible to use primefaces datalist and fieldset elements in a nested way. My application needs to look something like this:
<p:fieldset>
<p:dataList>
<p:fieldset>
<p:datalist>
</p:datalist>
</p:fieldset>
</p:dataList>
</p:fieldset>
I've tried it as mentioned above but I always get the following error:
javax.faces.view.facelets.TagException: /WEB-INF/flows/mainapp/wholesaleInfo.xhtml #106,105 Tag Library supports namespace: http://primefaces.org/ui, but no tag was defined for name: datalist
The datalist mentioned in the error message is of course the inner one... Any ideas how I could make that work? thanks Nikolaus
Try with dataList camelCase instead of datalist, in the inner one. This should make the error go away. However I am unsure if dataLists can be nested. If it's just for layout - display purpose, you may have a look at p:layout
How does this code in the PrimeFaces DataTable row selection work?
<p:commandButton update=":form:display" oncomplete="confirmation.show()" image="ui-icon ui-icon-close" title="Delete">
<f:setPropertyActionListener value="#{car}" target="#{tableBean.selectedCar}" />
</p:commandButton>
I am confused by the following: update=":form:display", and image="ui-icon ui-icon-close".
Is this inbuilt into Primefaces? or do I need to create an additional form, or have an external image mapped to it?
update=":form:display" refers to a specific element on the page. The first ':' goes to the root of the page, so there needs to be a component with the id "form" (probably a form) and inside that a component with the id "display". This means after the button actions has completed :form:display will be updated. Note that it's generally not a great idea to use absolute paths as they can be hard to keep up to date when you change the page structure. If the button is on the same level as the "display" component you could just do update="display", or you can do things like update="#form" to update the entire current form.
image="ui-icon ui-icon-close" refers to style classes in your css. These two comes predefined with primeface, but if you want to use custom graphics you can also define your own style classes for them.