Check added marking in gmap using primefaces jsf - google-maps

I'm a beginner in jsf, i use gmap in jsf to get long lat
<f:view contentType="text/html">
<p:gmap id="gmap" center="41.381542, 2.122893" zoom="15" type="ROADMAP"
style="width:600px;height:400px"
model="#{restaurant.emptyModel}"
onPointClick="handlePointClick(event);"/> </f:view>
How can i show a message that "Please add marker" when user has not added marker. Thank for helping

following example suggested by Darka, You need to place such code in Your button's action method:
public void buttonClick() {
if (emptyModel.getMarkers().isEmpty()) {
addMessage(new FacesMessage(FacesMessage.SEVERITY_ERROR, "Error!", "You didn't placed a marker!"));
}
}
public void addMessage(FacesMessage message) {
FacesContext.getCurrentInstance().addMessage(null, message);
}
Also ensure, that You have added update="messages" attribute to Your button on JSF page.
Short explanation: if user won't place a marker, emptyModel.getMarkers() should return empty list of markers. Then, if it's really empty, You add faces message. Updating growl will provide display of the error message on right upper corner of the page.
Hope this helps. Cheers!

Related

Primefaces switches between multiple dialogs

I`m using PrimeFaces 4.0. I have a page with three dialog components (Dialog 1, Dialog 2, Dialog 3) and three button components (Button 1, Button 2, Button 3), Dialog 1 will be showed by click button 1, Dialog 2 will be showed by click button 2, and Dialog 3 will be showed by click button 3. User can open these three dialogs in the same time, it means user can do some work with these three dialogs all been on show, just like this:
When user do some work in a dialog, I need to change some values in backing bean and update some components at first, and when user show a dialog by click a button, there is no problem and I can change some values when ActionListener of the button that user clicked fired, but when user showed three dialogs, and changes active dialog by click dialog like this:
How can I change active dialog from 'Dialog 1' to 'Dialog 2'?
Here is my xhtml code:
<p:commandLink onclick="dialog1.show()" update="outputText" actionListener="#{testBean.changeActiveDialog('Dialog 1')}">button 1</p:commandLink><br/>
<p:commandLink onclick="dialog2.show()" update="outputText" actionListener="#{testBean.changeActiveDialog('Dialog 2')}">button 2</p:commandLink><br/>
<p:commandLink onclick="dialog3.show()" update="outputText" actionListener="#{testBean.changeActiveDialog('Dialog 3')}">button 3</p:commandLink><br/>
<br/><hr/><h:outputText id="outputText" value="Active dialog: #{testBean.activeDialog}"/>
<p:dialog id="dialog1"
header="dialog 1"
resizable="true"
dynamic="false"
modal="false"
draggable="true"
widgetVar="dialog1"
minimizable="true"
maximizable="true">
dialog1
</p:dialog>
<p:dialog id="dialog2"
header="dialog 2"
resizable="true"
dynamic="false"
modal="false"
draggable="true"
widgetVar="dialog2"
minimizable="true"
maximizable="true">
dialog2
</p:dialog>
<p:dialog id="dialog3"
header="dialog 3"
resizable="true"
dynamic="false"
modal="false"
draggable="true"
widgetVar="dialog3"
minimizable="true"
maximizable="true">
dialog3
</p:dialog>
And my view bean:
public class TestBean extends BaseBean {
private String activeDialog;
public void changeActiveDialog(String dialog)
{
activeDialog = dialog;
}
public String getActiveDialog() {
return activeDialog;
}
public void setActiveDialog(String activeDialog) {
this.activeDialog = activeDialog;
}
}
I googled it but I didn't find the solution on my problem. Any suggestion will be appreciated, thanks in advance.
Although opening multiple dialogs in the same time is not a good idea, but you can always use javascript to achieve what you want.
The z-index would be changed when the dialog is clicked or dragged, making it "active"/above the other elements, in that case you can setup two main events to listen on: click and dragstop then send that dialog id to the managedBean by a remoteCommand, here's an example:
javascript
$('.ui-dialog').on('click dragstop',function () {
activeDialog([{name: 'activeDialog', value: $(this).attr('id')}]);//remoteCommand
});
xhtml
<p:remoteCommand name="activeDialog" actionListener="#{mainBean.activeDialog}"/>
managedBean
public void activeDialog() {
FacesContext facesContext = FacesContext.getCurrentInstance();
Map map = facesContext.getExternalContext().getRequestParameterMap();
String activeDialog = (String) map.get("activeDialog");//Active dialog
}
A little demo, and a working example on github.
Note: you should keep the actionListener on the first time the dialog is opened.
I think you should never open more than 1 dialog at the same time.
Try to change your design (for example, create 1 large dialog instead of the 3 ones).

Pass a bean in a dialog with Dialog Framework in Primefaces

I have some problem to pass a entire bean in a dialog.
I would like to open a dialog with Dialog Framework in Primefaces, and pass the method and attributes content in bean.
I tried to make this code, but it don't work.How should I do?
<p:commandButton value="open dialog" ajax="true"
actionListener="#{processController.openSelectFieldDialog}"
update="tableResult , :notificationForm:info-messages">
<f:attribute name="controller" value="#{processController}" />
</p:commandButton>
This is the code inside openSelectFieldDialog method:
public void openSelectFieldDialog(){
RequestContext.getCurrentInstance().openDialog("genericSelectFieldDialog");
}
And this is the code inside the dialog controller:
public void onload() {
Object somethingBean= FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap().get("controller");
}
I understand that i pass parameters on openDialog method, but i don't find any example on primefaces site. Can you help me?
Thanks

Scroll p:messages into view when it is updated and (error) messages are present

I am working with PrimeFaces messages, I want my whole page to scroll to top when p:messages is rendered.
Assign an ID to your p:message component
<p:messages autoUpdate="true" id="myMessage" />
Then, in your backing bean call RequestContext.scrollTo method:
in PrimeFaces >= 6.0:
PrimeFaces.current().scrollTo("myMessage")
in Primefaces < 6.0:
RequestContext context = RequestContext.getCurrentInstance();
context.scrollTo("myMessage");
which is deprecated in PrimeFaces 6.0
Deprecated with PrimeFaces < 6.2
In you backing bean (that one which produces the messages), you should know when you render a p:message. If so simply execute this:
RequestContext.getCurrentInstance().execute("window.scrollTo(0,0);");
Update:
With the newer PrimeFaces versions (>= 6.2), the approach to execute Javascript on the client side is (by using x and y coordinates):
PrimeFaces instance = PrimeFaces.current();
instance.execute("window.scrollTo(0,0);");
To scroll to an element use the element's clientId:
PrimeFaces instance = PrimeFaces.current();
instance.scrollTo("myElementsClientId");
Find more information here:
http://de.selfhtml.org/javascript/objekte/window.htm#scroll_to
examples with jQuery for smooth scrolling as well: Scroll to the top of the page using JavaScript/jQuery?
Lets say that your button is causing the messages to appear.
XHTML
<p:commandButton value="Save"
oncomplete="scrollToFirstMessage()" />
javascript
//javascript function which scroll to the first message in page
function scrollToFirstMessage() {
try {
PrimeFaces.scrollTo($('.ui-message :first-child').eq(0).parent().attr('id'));
} catch(err) {
//No Message was found!
}
}
Hope this helps.
There are valid answers already that show how to scroll to the p:messages component, but they all require you to execute code in a backing bean. This requires you to do / call the same in each action. None show how to scroll to the messages component when it is rendered (updated).
You can implement a phase listener and check messages are present and if the messages component's clientId is present in the PartialViewContext renderIds:
These client identifiers are used to identify components that will be processed during the render phase of the request processing lifecycle.
Your listener can look something like this:
public class MessagesUpdateListener implements PhaseListener {
private final String MESSAGES_ID = "yourMessagesClientId";
#Override
public void afterPhase(PhaseEvent event) {
// Empty
}
#Override
public void beforePhase(PhaseEvent event) {
FacesContext fc = FacesContext.getCurrentInstance();
if (!fc.getMessageList().isEmpty() &&
fc.getPartialViewContext().getRenderIds().contains(MESSAGES_ID)) {
RequestContext.getCurrentInstance().scrollTo(MESSAGES_ID);
}
}
#Override
public PhaseId getPhaseId() {
return PhaseId.RENDER_RESPONSE;
}
}
Make sure to register it in your faces-config.xml:
<lifecycle>
<phase-listener>your.MessagesUpdateListener</phase-listener>
</lifecycle>
Tested with XHTML:
<h:form id="main">
<p:messages id="messages" />
<p:inputText id="text1" required="true" />
this<br/>is<br/>a<br/>long<br/>page<br/>this<br/>is<br/>a<br/>long<br/>page<br/>
this<br/>is<br/>a<br/>long<br/>page<br/>this<br/>is<br/>a<br/>long<br/>page<br/>
this<br/>is<br/>a<br/>long<br/>page<br/>this<br/>is<br/>a<br/>long<br/>page<br/>
this<br/>is<br/>a<br/>long<br/>page<br/>this<br/>is<br/>a<br/>long<br/>page<br/>
this<br/>is<br/>a<br/>long<br/>page<br/>this<br/>is<br/>a<br/>long<br/>page<br/>
this<br/>is<br/>a<br/>long<br/>page<br/>this<br/>is<br/>a<br/>long<br/>page<br/>
this<br/>is<br/>a<br/>long<br/>page<br/>this<br/>is<br/>a<br/>long<br/>page<br/>
<p:commandButton value="Update" update="messages text1"/>
<p:commandButton value="No update"/>
</h:form>
To check for global messages, use:
fc.getMessageList(null).isEmpty()
See also:
Add global message when field validation fails

is possible use two growls in one page

I want to use two growls in one page. One use to show success message that do auto hide (sticky="false"), the other one use to show failed messages that do not auto hide (sticky="true"):
<p:growl id="globalSuccessMessageGrowl" showDetail="false"
showSummary="true" life="3000" />
<p:growl id="globalFailedMessageGrowl" showDetail="false"
showSummary="true" sticky="true" />
public static void globalSuccessMessage(String message,
FacesMessage.Severity severity) {
FacesContext.getCurrentInstance().getViewRoot().findComponent("globalSuccessMessageGrowl");
renderComponent(new FacesMessage(severity, message, message), null,
"globalSuccessMessageGrowl");
}
public static void globalFailedMessage(String message,
FacesMessage.Severity severity) {
renderComponent(new FacesMessage(severity, message, message), null,
"globalFailedMessageGrowl");
}
...but the two growls do not auto hide after 3 seconds. Failed growl effects success growls?
You can assign different severity levels to each one. This was an attribute added to primefaces in version 3.3.
Check this question . The user had the same problem as you do.

PrimeFaces open dialog several times with rendered attribute

I try to implement a dialog box accessible everywhere in my project and I was wondering if this solution is possible.
The dialog is included in the template of my project. For example, where I am on the login page, I would like to show the dialog when the button "Login" is clicked and the authentication is successful. So I catch the bean linked to the dialog with:
getFacesContext().getELContext().getELResolver().getValue(getFacesContext().getELContext(), null, beanName);
and I set the "show" argument. (have a look below)
The first time, it's working. When I access the login page, the dialog is not rendered and when I click the button login, the attribute show is set, the page is updated and the dialog appears. But if I close it, I could not fire it again when I click again the button. (The dialog is rendered but not shown)
My dialog is like this (I have visible="true" cause I want to show each time it's rendered):
<h:form>
<p:dialog header="Dialog" widgetVar="myDialog" rendered="#{bean.show}" visible="true">
<p:ajax event="close" listener="#{bean.onClose}" />
...
</p:dialog>
</h:form>
The bean is in viewscope:
#ManagedBean(name = "bean")
#ViewScoped
public class MyBean {
private boolean show; // + Getters and Setters
#PostConstruct
public void init() {
this.show = false;
...
}
public void onClose() {
this.show = false;
}
}
And I can add that my LoginBean which is setting the show argument is in viewScope too.
Thanks