GoogleMaps won't render in JSF - google-maps

I'm building a simple webapp that shows a map from GoogleMaps with multiple markers loaded from my database... but I can't get it to render...
I'm using JSF 2 and gmaps4jsf.
My page looks like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:m="http://code.google.com/p/gmaps4jsf/">
[...]
<m:map width="500px" latitude="10.1" longitude="10.1" height="500px" zoom="6" autoReshape="true">
<ui:repeat var="loc" value="#{locs}">
<m:marker latitude="#{loc.latitude}" longitude="#{loc.longitude}">
<m:htmlInformationWindow htmlText="#{loc.latitude}-#{loc.longitude}" />
</m:marker>
</ui:repeat>
</m:map>
[...]
I copied the code from an example that is supposed to work... but I can't see the map.
I have gmaps4jsf-core-3.0.0.jar on my classpath, I think I don't have to configure anything else... any ideas?
EDIT: It seems that the tags are not being recognized. When I click on "view source code" in the browser the gmaps tags are not "translated", they are being shown as I wrote them in the xhtml file.

If your tags are not being translated the most probably is that the jar file is in the wrong place. Something is avoiding your webapp to find it. How are you building it?
Place the the latest library jar in your web application WEB-INF/lib folder.
Your m:map has to be inside a h:form tag.
Due to your library version you should include a javascript code:
<script type="text/javascript"
src="https://maps.googleapis.com/maps/api/js?sensor=true">
</script>
Take a look at this simple example for using gmaps4jsf2 library.
Have you got it working with a very basic configuration first?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:m="http://code.google.com/p/gmaps4jsf/">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
template="/template/base-template.xhtml">
<ui:define name="js">
<script type="text/javascript"
src="https://maps.googleapis.com/maps/api/js?sensor=true">
</script>
</ui:define>
<ui:define name="title">
This is the new title
</ui:define>
<ui:define name="content">
<h1>Simple Map with a marker and an InfoWindow</h1>
<h:form id="form">
<m:map width="500" height="450px" latitude="37.13" longitude="22.43" enableScrollWheelZoom="true">
<m:marker>
<m:htmlInformationWindow htmlText="This is Sparta, Greece"/>
</m:marker>
</m:map>
</h:form>
</ui:define>
</ui:composition>
</html>
Regards,

Related

Why connectors in primefaces flowchart componant not appeared?

I am trying to use flowchart component in primefaces to view process flow but the connectors not appeared with me i used same code in the demo in this link
[primefaces demo]
https://www.primefaces.org/showcase/ui/data/diagram/flowchart.xhtml
i just copy and paste same demo code but the result is like that
[result with no connectors]
https://i.stack.imgur.com/WwIgo.png
my question what is missing to get the same result in the demo??
You've already found out that the showcase has a small pitfall builtin as it does'nt show the complete xhtml-page. A minimal empty page with the common namespaces is something like
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:c="http://xmlns.jcp.org/jsp/jstl/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
</h:head>
<h:body>
</h:body>
</html>
h:head is important as Primefaces automagically injects the dependencies (stylesheets, scripts) here.

Primefaces: Menuitem (or button) does not work in Internet Explorer after update

I am experiencing some weird behavior with menu items on updated components. My sample JSF page looks as follows:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head/>
<h:body>
<h:form id="form">
<p:menubar id="menubar" widgetVar="menubar">
<p:menuitem value="Select me" onclick="alert('Menu item selected')"/>
</p:menubar>
<p:commandButton value="Update menubar" update="menubar"/>
</h:form>
</h:body>
</html>
When I run this in Internet Explorer 11 and click on "Update menubar", the menu item no longer functions, i.e. the alert is not displayed, and the URL in the address bar changes from ..../test.xhtml to ..../test.xhtml#.
When I run the same with Firefox, everything works nicely, i.e. even after an update of the menubar via a button click, the menu item still displays the alert.
Is this behavior an IE bug? Or is it supposed to work that way? Is there a workaround for the IE behavior?
Edit:
The problematic sample can be further reduced; the same problem arises in a form that consist solely of two buttons, with one updating the other, causing it to stop working in IE:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head/>
<h:body>
<h:form id="form">
<p:commandButton value="Click me" onclick="alert('Button clicked')"
id="button" widgetVar="button"/>
<p:commandButton value="Update button" update="button"/>
</h:form>
</h:body>
</html>
Okay, after further investigation it appears that the problem is caused by missing access rights in my IE installation - somehow the AJAX response involved in the update does not get handled correctly (even though no corresponding error messages or log entries are shown).
So, luckily, nothing's wrong with Primefaces here :)

JSF not rendering HTML5 tags

I am using JSF and want to render html5 tags but they get ignored and not rendered at all into my browser.
So in the below example code, my page just shows one input box and the second one does not get rendered at all.
I'm using JSF 2.2 (Mojarra implementation javax.faces-2.2.0-m01.jar)
Any idea why such a behaviour?
My .xhtml page is:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://xmlns.jcp.org/jsf/passthrough"
>
<h:body>
<input type="text" placeholder="Enter your Name from HTML5 tag" />
<h:form>
<h:inputText p:placeholder="Enter your Name from JSF" />
</h:form>
</h:body>
Change !DOCTYPE declaration to just <!DOCTYPE html>.
Finally fixed it by using Mojarra 2.2.2 (you can also even use the very latest ones). ...as in 2.2.0 and 2.2.1 the XML namespaces are broken as detailed in the post Using new xmlns.jcp.org namespace on composites causes java.lang.NullPointerException at java.util.concurrent.ConcurrentHashMap.putIfAbsent

JSF 2 remove xml declaration in rendered output

The wrong html output:
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
...
The main template:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:t="http://myfaces.apache.org/tomahawk"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:fn="http://java.sun.com/jsp/jstl/functions">
<h:head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title><h:outputText value="dmw #{title}"/></title>
<h:outputStylesheet library="#{uiSkin}" name="css/layout.css" />
<h:outputStylesheet library="standard" name="css/developer.css"
rendered="#{developMode}" />
...
</h:head>
<h:body>
Example of a included page:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:t="http://myfaces.apache.org/tomahawk"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
<ui:composition>
...
</ui:composition>
</html>
Used Versions:
<jsf-api.version>2.1</jsf-api.version>
<jsf-impl.version>2.1.21</jsf-impl.version>
<richfaces.version>4.3.2.Final</richfaces.version>
<prettyfaces.version>3.3.3</prettyfaces.version>
<tomahawk.version>1.1.14</tomahawk.version>
When i remove all ui:include and ui:insert tags everything is fine. I build a smaller Testproject which also works like suspected. The error seems to occur when a included page is loaded. A ui:insert tag which can´t be resolved doesn´t lead to the error. I think it has something to do with the rendering configuration.
I tried a few entries in faces-config but without sucess.
The following entry removes the unwanted declaration but also the doctype.
<faces-config-extension>
<facelets-processing>
<file-extension>.xhtml</file-extension>
<process-as>xml</process-as>
</facelets-processing>
</faces-config-extension>
XML prolog / instruction not removed from XHTML output
I have no idea where it comes frome?
Does anybody have a clue?
If you use the 'xml' processing method for facelet files, the doctype is consumed during the process, alongside with the processing instructions. See the table in this answer: https://stackoverflow.com/a/10706157/801153.
To reapply the DOCTYPE tag, you can use the jsf h:doctype tag before the html. To do so you need to enclose the tags in a ui:composition tag, like this:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
<h:doctype rootElement="html" xmlns:h="http://java.sun.com/jsf/html" />
<html lang="nl">
... page content ...
</html>
</ui:composition>
The processing instruction and the DOCTYPE in this snippet apply to the .xhtml file source content, not the generated output. These must remain if you have your sourcefiles in xhtml format.
Alternatively you could experiment with the 'html5' type, as also specified in the table in the linked answer above. This would be useful if you have or create your sourcefiles as html5 files. This is the default processing method, when nothing is specified.
This retains the doctype in a simplified version. However, this also passes any <?xml .. ?> processing instruction to the html output (your original issue). So you should then remove these processing instructions from your sourcefiles.

Warning: This page calls for XML namespace declared with prefix [html tag] but no taglibrary exists for that namespace

I know this question has been asked several times, but I just can't seem to find what's wrong with my code so I'm asking for it again - sorry :-).
I'm currently working on JSF2.1 on a JavaEE6 framework deployed on Glassfish. For the page that throws this error I have a baseTemplate, which includes a header and footer. Then I have a page that inherits the baseTemplate, basically here they are:
BaseTemplate:
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<f:view>
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<link rel="shortcut icon" href="" />
<h:outputStylesheet library="css" name="site.css" target="head"></h:outputStylesheet>
<ui:insert name="head" />
</h:head>
<h:body>
<div id="wrapper" class="rounded-box">content...
Header
<?xml version='1.0' encoding='UTF-8' ?>
<f:view xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<div class="header">
Footer just contain, plain html tags.
And the actual page, which is a login.
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
template="/shared/page/_twoColumn.xhtml">
<ui:define name="head"></ui:define>
<ui:define name="leftContent">
</ui:define>
<ui:define name="content">...........
What could be the problem? Note that I already have the xmlns:h="http://java.sun.com/jsf/html" namespace.
Thanks,
czetsuya
Footer just contain, plain html tags.
You need to declare the default XML namespace of http://www.w3.org/1999/xhtml in the root element there as well. You'd better use <ui:composition> as XML root element in all include and template files (also the header; the <f:view> doesn't belong there at all).
/WEB-INF/footer.xhtml
<ui:composition
xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
>
<div>Plain HTML</div>
</ui:composition>
The [html tag] which you're seeing in the warning message is the first plain HTML tag which appears in the footer.
See also:
How to include another XHTML in XHTML using JSF 2.0 Facelets?