I have found the thread answered by BalusC
It describes the exact problem I have. When I found it I thought I have found my answer as well, but for me the solution is not working. I had problems with the < h:outputScript> tag already, maybe it is the same problem (the < script> tag is working).
I have the same project description as the user Plaha, that put the question. I am trying to call a JavaScript function defined in the template page with the parameters attributes of the backing JSF bean. But for now the alert function is enough.
I`ve tried to make the page gridTest.xhtml to look like content.xhtml from the example, but it doesn't work.
The gridsTemplate.xhtml looks exactly like the template in the thread + I have the < head> tag in which I have some JavaScript functions. My gridTest.xhtml:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" 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:c="http://java.sun.com/jsp/jstl/core">
<h:head>
<link rel="stylesheet" type="text/css"
href="/juritest/resources/css/style.css" />
<script type="text/javascript"
src="/juritest/resources/js/jquery-1.8.2.js"></script>
<script type="text/javascript" src="/juritest/resources/js/menu.js"></script>
</h:head>
<body>
<ui:composition template="../../templates/gridsTemplate.xhtml">
<ui:define name="content">
<h:form rendered="#{gridPopUpBean.testNotStarted}">
...
</h:form>
<h:form rendered="#{not gridPopUpBean.testNotStarted}">
<h:outputScript target="body">
alert("working?");
</h:outputScript>
...
I have tried for curiosity to put the < h:outputScript directly under the ui:define like in the example, but it doesn't work either.
Related
Hi I'm new to JSF and jQuery .
Do I need to download any jQuery jar and pack to war in order to use?
Because in my code I can't call the jquery function.
<!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">
<h:head>
<script type="text/javascript" src="js/jquery-1.7.1.js"></script>
<script type="text/javascript" src="js/06.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#form\\:name").click(function() {
alert("hii");
});
});
</script>
</h:head>
<h:body>
<h:form id="form">
<h:outputText id="hi" value="hi guys"></h:outputText>
<input id="name" />
</h:form>
</h:body>
</html>
This alert doesn't popup when I click on the output box.
In my pom I use this dependency.
<dependency>
<groupId>com.efsavage.jquery</groupId>
<artifactId>jquery-maven</artifactId>
<version>1.7.2</version>
</dependency>
You can use it as in another web applications, jsf tags support onclick attribute also.
please download my jsf-frontend fully configured web applications(JSF2.2+Primefaces+JQuery) and test on it.
Here is a link, JSF2.2 front end
One note: Primefaces also used Jquery and you can use it, or you can skip and include your jquery.
In my project you can find header files whit configuration.
Also good example here How to get JSF id via jQuery
Good luck!
I've recently ran into a problem and I would really use a bit of help from the community. I'm trying to load a HTML file using jQuery load().
The index file:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Question</title>
<meta http-equiv="Content-Type" Content="text/html; charset=euc-kr" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
function restart(){
$("#wrap").load('new-content.html').hide().fadeIn('slow');
}
</script>
</head>
<body>
<div id="wrap">
<div id="content">Text before restart: 남성</div>
</div>
<br />
Restart
</body>
</html>
The new HTML file includes some simple HTML content and a call to a .js file (used for some animations). The new content file:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Question</title>
<meta http-equiv="Content-Type" Content="text/html; charset=euc-kr" />
<script src="main.js" language="javascript" type="text/javascript" />
</head>
<body>
<div id="contentInner">Text after restart: 여성</div>
</body>
</html>
As you can see I've included the correct encoding charsets (for both files) and I've double checked and I can confirm that every file used for this part of the code it's encoded as "KOREAN" (checked in different apps like Dreamweaver, Notepad++, Sublime Text 2).
Yet still once I load the content the characters are not encoded properly; question marks appearing instead of characters.
Of course I made some searching before posting and I found a few helpful topics about this called the PHP header solution, but this isn't an options since it need to use HTML/JS/CSS only.
The same behavior occurs when I'm using the Japanese language too. In other latin based languages everything is working perfectly fine of course.
Any sort of input/advice/help would be much much appreciated.
Thank you!
I am new to Javascript and Java Server Faces and I am having the next Problem.
The Code below is working ok:
<?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:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript">
function initialize()
{
alert("Testing");
}
</script>
</head>
<body onload="initialize()">
<h1 align="center">Sol-Tech</h1><br />
</body>
</html>
But when I add a FOR loop, it doesn't work:
<?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:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript">
function initialize()
{
for(var i; i<3; i++)
{
alert("Test");
}
}
</script>
</head>
<body onload="initialize()">
<h1 align="center">Sol-Tech</h1><br />
</body>
</html>
Has anyone any suggestion on how to perform a FOR loop in javascript without getting an error?
Thanks in advance,
Emanuel
You're using an outdated version of Mojarra which exposes a bug wherein this kind of IllegalArgumentException: null source is incorrectly been thrown when the view file contains a XML syntax error or when the view couldn't be restored. See also java.lang.IllegalArgumentException: null source and JSF issue 1762.
If you upgrade to a newer Mojarra version (currently already 2.1.14), then you'll in this particular case get a more self-explaining XML syntax error on the character < which indicates the start of a XML element. Facelets is namely a XML based view technology and parsed by a SAX parser. You'd need to replace the XML special character < by <
for(var i=0; i<3; i++) {
alert("Test");
}
or to put the whole script in a CDATA block
<script type="text/javascript">
<![CDATA[
function initialize()
{
for(var i=0; i<3; i++)
{
alert("Test");
}
}
]]>
</script>
or to just put it in its own .js file so that it won't be parsed as XML.
<script type="text/javascript" src="script.js"></script>
See also:
Writing JavaScript for XHTML
Unrelated to the concrete problem, the JS syntax error (uninitialized var i which I've already fixed in code snippets) is actually a completely different problem and would only show an error in client side in browser's JS console and definitely not cause an exception in the server side as JS doesn't run in webserver at all, but only in webbrowser.
I have a jsf component that must access to a javascript file, i added this whith outputScript as in the code bellow, I get an error in the generated html, and the javascript can't be reached.
The javascript file is located in document_root/js directory
How can i resolve this problem, thank you for your help.
<!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:composite="http://java.sun.com/jsf/composite"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:head><title>(For validation only)</title>
<link href="./css/styles.css"
rel="stylesheet" type="text/css"/>
</h:head>
<h:body>
<composite:interface/>
<composite:implementation>
<h:outputScript library="js" name="messages.js" />
<h:outputScript library="js" name="DateValidation.js" />
<h:form id="f">
<h:outputText value="Date" />
<h:inputText id="dateA"
onblur="return validateDateField('f:dateA');">
</h:inputText>
</h:form>
</composite:implementation>
</h:body>
</html>
Those files have to be placed in the /resources subfolder. So, you should have the following in the public webcontent:
/resources/js/DateValidation.js
/resources/js/messages.js
Unrelated to the concrete problem, your composite component approach is pretty awkward. I'd suggest to check out composite-component tag wiki: https://stackoverflow.com/tags/composite-component/info
I have an XHTML 1.0 Strict document in which I'm trying to make Shadowbox work.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta name="Content-Type" content="text/html; charset=UTF-8" />
<title>Test page</title>
<link rel="stylesheet" type="text/css" href="shadowbox.css" />
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init();
console.log('Howdy there!'); // displays, so no JS error in Shadowbox.init
</script>
</head>
<body>
<p>
<a href="image.jpg" title="Howdy" rel="shadowbox">
<img src="image.jpg" alt="Click to zoom." />
</a>
</p>
</body>
</html>
This document is completely valid according to my Firefox extension.
For some reason Shadowbox seems to do nothing. When I click the image link, the browser just opens the image as usual. No box at all.
I've tried not loading JQuery and only load Shadowbox but that didn't help, so it's not JQuery's fault either. This is with Shadowbox 3.0b by the way. Any ideas?
EDIT: I just got thinking... Shadowbox does some internal magic to figure out the path to it. However, this page is completely static and loaded directly from file on disk. Could this be the problem? Looking in the DOM, I see that Shadowbox.path is correctly set to "file:///C:/..." so maybe not?
You need to have (nebo have to have) all directories from showbox.zip in the directory with the file showbox.js, because showbox adds other scripts to the page.