I tried editing PrimeFaces locale message but the changes is not reflecting. I already check the widget of calendar in web console and the changes is already there. But still it uses the default message.
Calendar_en_US.js
PrimeFaces.locales['en_US'] = {
//other stuff
messages : {
..
'javax.faces.converter.DateTimeConverter.DATE_detail':'[E-WAR-0037][E-WAR-0037] {2}: \'{0}\' could not be understood as a date. Example: {1}',
..
};
and attached to page by
<h:outputScript library="js" name="${request.contextPath}/resources/js/calendar_en_US.js" />
and used it to calendar
<p:calendar widgetVar="issueDateVar" id="issueDate" pattern="yyyy-MM-dd" size="14" showOn="button" locale="en_US"
navigator="true" styleClass="#{maintainUi.requiredStyleClass}" onblur="transformVal(this);"
value="#{maintainUi.obj.IssueDate}"
disabled="#{maintainUi.readOnly}"/
The message error is still
Warrant Issue Date: '999' could not be understood as a date. Example: 2019-04-17
it Should be
[E-WAR-0037]Warrant Issue Date: '999' could not be understood as a date. Example: 2019-04-17
Starting from JSF 1.2, use the converterMessage attribute to replace the entire message.
I found my solution here
Custom Variables in JSF Converter's Error Message
Related
I have added PrimeFaces schedule from this page and got the results like the following:
I got the following events working fine but how do I get and handle events when prev or next is clicked?
I have also highlighted some more in the image:
<p:ajax event="dateSelect" listener="#{scheduleJava8View.onDateSelect}" update="eventDetails" oncomplete="PF('eventDialog').show();" />
<p:ajax event="eventSelect" listener="#{scheduleJava8View.onEventSelect}" update="eventDetails" oncomplete="PF('eventDialog').show();" />
<p:ajax event="eventMove" listener="#{scheduleJava8View.onEventMove}" update="messages" />
<p:ajax event="eventResize" listener="#{scheduleJava8View.onEventResize}" update="messages" />
To capture dates / view changes on the server / in your bean, I found it easiest to just go for lazy loading (showcase, documentation). This will basically allow you to have a method in the bean where the start and end date are passed in case the view changes:
lazyModel = new LazyScheduleModel() {
#Override
public void loadEvents(LocalDateTime start, LocalDateTime end) {
//
}
};
.. and as a bonus, your events will be lazily loaded!
Note that the type of dates (java.time.LocalDateTime or java.util.Date) will depend on the PrimeFaces version. See the migration guide.
To modify the UI, you need to know that PrimeFaces is using FullCalendar for the p:schedule component. You can use the extender attribute and configure the FullCalendar to your needs. See the toolbar documentation. Note that the version of FullCalendar will depend on the PrimeFaces version. Again, see the migration guide.
To set the time format, use the timeFormat attribute. It uses Moment.js. You could use hh:mmA. Try it on https://www.primefaces.org/showcase/ui/data/schedule/configureable.xhtml
The documentation on the Primefaces showcase page gives a number of examples for ajax and non-ajax reset buttons. One is called "reset fail" and it can be found here. It simply involves calling an actionListener which sets all relevant backing bean fields to null.
I tried "reset fail" and it seems to do the job. So why is it a "fail" example and why do the docs say it "won't work"?
Thanks!
OK try this...
On that Showcase demo page enter "a" in the first field and "bbb" in the second field and press "Submit". You will get a validation error.
Now press "Reset Fail". See how the first field is still highlighted RED as validation has failed?
Now press "Reset Tag" and you will see the RED highlighted field go away.
So the difference is the Reset Fail doesn't reset the validation failures and Reset Tag does.
In the end, a combination of actionListener= and resetValues="true" worked for me, i.e:
<p:commandButton value="Reset" actionListener="#{otb.resetFail}" process="#this" update="#form" resetValues="true" style="margin-left:20px;"/>
Without the actionListener my fields don't clear properly. But the resetValues attribute is needed to get around the validation issue. I got this idea from the StanL answer in this post.
One more thing - in contrast to the example in the PF demo, my bean's "resetFail" method just nulls out the fields. It does not call PrimeFaces.current().resetInputs("form:panel"); (I don't have that library). Still, it works fine.
I am building a react-based electron application and stumbled across a problem with date fields.
When using an input field with type='date' the onChange event is not fired. Additionally it seems I can not enter a full date, as soon as i modify the third component of the date it resets.
So the default state (the rendered input field, the state in react for the value is "") is tt.mm.jjjj (german) which translaes to mm/dd/yyyy i think. I can focus the field and enter 01 > 01, then it states: 01.01.jjjj. As soon as i type one number for the year everything gets reverted to tt.mm.jjjj
I created an empty html file with an input[type=date] element and it works in chromium, so it seems to be the react-component, that is buggy.
My component looks like:
<input
type="date"
className="input-group-field"
name="birthdate"
id="birthdate"
value={this.state.birthDate}
onChange={event => this.setState({birthdate: event.target.value})}
/>
Electron = 1.7.8
Chromium = 7.9.0
React = 15.6.2
Any idea on how to fix this?
this.state.birthDate and this.setState({birthdate: event.target.value}) wrong.
setState is case-sensitive. try:
this.setState({birthDate: event.target.value})
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>
How can I use an AJAX listener inside a tabview. Whenever the tab opened(or for a mouse click anywhere), the listener need to execute. I tried with event=click,change,blur etc, but not worked.
<p:tabView activeIndex="#{backingbean.tanIndex}">
<p:ajax event="?" listener="#{backingbean.setTabIndex}" />
in view.jsf:
<p:tabView>
<p:ajax event="tabChange" listener="#{employeeEdit.onTabChange}">
in edit.jsf:
<p:tabView activeIndex="#{employeeEdit.tabIndex}">
in backingBean:
private int tabIndex;
public int onTabChange(TabChangeEvent event)
{
// Here I'm getting event.getTab().getId() and set it to `tabIndex` property.
}
When editing I need redirect to the that tab which is active in view. So if I didn't change the tab onTabChange() will not execute and tabIndex has its old value only.
I'm using Primefaces version-3.0.M3.
It looks like this was a Primefaces bug that was fixed in the newest 3.0.1 release:
http://forum.primefaces.org/viewtopic.php?f=3&t=17288
I had a similar problem with Primefaces 5.1
As long as i put the tabview into a form everything worked fine.
But because i wanted to use seperate forms in my tabs i had to remove the surrounding form of the tabview to avoid nested forms.
Without the surrounding form the ajax event didn´t get triggered any more when changing the tab.
My solution was to use a remotecommand in a form parallel to the tabview.
The remotecommand is triggered by the onTabChange attribute of the tabview element.
At that call i forwarded the index parameter to the global request parameters.
<p:tabView id="rootTabMenu" styleClass="tabcontainer" prependId="false"
activeIndex="#{sessionData.activeTabIndex}" widgetVar="rootTabMenu"
onTabChange="tabChangeHelper([{name: 'activeIndex', value: index}])">
// Tabs...
</p:tabView>
<h:form id="tabChangeHelperForm">
<p:remoteCommand name="tabChangeHelper" actionListener="#{sessionData.onTabChange()}" />
</h:form>
In the backing bean i catched the value again from the request parameter map and set the active index.
public void onTabChange()
{
FacesContext context = FacesContext.getCurrentInstance();
Map<String, String> paramMap = context.getExternalContext().getRequestParameterMap();
String paramIndex = paramMap.get("activeIndex");
setActiveTabIndex(Integer.valueOf(paramIndex));
System.out.println("Active index changed to " + activeTabIndex);
}
Hope that can help you
Not sure if what I am writing is true for ver 3.0.M3. I have in front of the documentation of ver 3.0RC2 and there is a paragraph about this, with explaination and sample code (chapter TabView, paragraph Ajax Behaviour Events). You should have a look at that.
This is the part of the sample code that should help most:
<p:tabView>
<p:ajax event=”tabChange” listener=”#{bean.onChange}” />
</p:tabView>
Jaron has an answer that the 3.0.1 release fixed this but I had this all the way up to 3.5 i believe i was still having this problem. on firefox and IE, the javascript handler for the Tabs weren't firing the ajax event. On google chrome, for whatever reason, it actually worked.
I moved up to Primefaces 5.0 today and this does NOT have the problem any longer. So at the very worst-case, go to Primefaces 5.0 and you'll be all good in the hood