Forum:

image rendering issue with h:commandButton

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Hello folks,

First off, I don't know a lot about web design or even the design of these pages in particular. I outsourced the design part, got html files, and am now implementing functionality using JSF 2.0. I don't actually even know what makes the button look like it's supposed to in the first place.

I have code that looks like this:

which outputs something that looks like this:

That is obviously not what it should look like. The button is being rendered as a broken image. But it works perfectly.

If I take away the name attribute of the commandButton and have code that looks like this:

Then I get something that looks like this:

This is what it should look like, but... when I press the button it causes this error:

java.io.FileNotFoundException: /OHP-Site/faces/index.xhtml Not Found in ExternalContext as a Resource

any ideas?

prasad kakani

Ranch Hand

Posts: 59

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Hi Elie,

here there is no attribute like class for all (h: ) tags. i think if they are style sheet classes then you need to refer it as styleClass which is one of the attribute of all jsf2.0 components.

remove the class="submit" and try to run in debug mode.

Thanks
prasad

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Thanks for the reply.

I have tried taking out the Class attribute and it doesn't do anything. I changed it to styleClass and still no effect at all. The only thing that makes any difference is removing the name attribute (which makes it not work as stated before)

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

1. Writing your own login code is suicide and I don't care how many J2EE books use a "login page" as an example. I've never run into a user-written security system that couldn't be hacked, usually fairly quickly, and I've been doing J2EE since before they invented JSPs. Use a pre-debugged professionally-designed security framework such as the one that comes standard with J2EE and integrates directly into web.xml.

2. "class" is a reserved word in Java, so in order to reduce conflicts, JSF uses "styleClass" instead.

3. In JSF you don't write Controllers. The Controllers are the FacesServlet and logic in the JSF UIComponents. Backing beans are not Controllers, they are Models.

4. My bleary eyes cannot spot an image tag in your sample View Definition, but apparently you didn't include everything. You should be able to use your browser's source examination features to get the actual URL being requested. If we have that plus the source of the image tag (or CSS), we should be able to un-break it.

5. That last message would see to say that your WAR doesn't contain an OHP-Site/faces/index.xhtml resource. Although come to think of it, that resource path looks a lot like a JSF URL that wasn't configured to route to the FacesServlet. Meaning that your web.xml definitions are not set up properly.

The secret of how to be miserable is to constantly expect things are going to happen the way that they are "supposed" to happen.

You can have faith, which carries the understanding that you may be disappointed. Then there's being a willfully-blind idiot, which virtually guarantees it.

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Thanks Tim, especially for touching on some other issues as well.

Regarding the issue at hand, I posted all jsf code on that page. The other code on that page is inconsequential html code. I have no idea where that image is supposed to be. I have looked in the css file, but can't find anything...

Here is the source for that button when the name attribute is present (and therefore works but does not render properly):

Here is the source when the name attribute is not present (and therefore renders properly but does not work):

index.xhtml is the name of the page on which this is all happening and I can get to it fine by going to http://localhost:8080/OHP-Site/faces/index.xhtml, not to mention the error only happens when that button is pressed and doesn't have a name attribute. So there is likely nothing wrong with web.xml.

and for your viewing pleasure, here's the entire css file:

@font-face {
    font-family:'Stanberry';
    src:url('../fonts/stanberry-webfont.eot');
    src:url('../fonts/stanberry-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/stanberry-webfont.woff') format('woff'), 
       url('../fonts/stanberry-webfont.ttf') format('truetype'), url('../fonts/stanberry-webfont.svg#StanberryRegular') format('svg');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family:'Vegur';
    src:url('../fonts/vegur-r_0.602-webfont.eot');
    src:url('../fonts/vegur-r_0.602-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/vegur-r_0.602-webfont.woff') format('woff'), 
        url('../fonts/vegur-r_0.602-webfont.ttf') format('truetype'), url('../fonts/vegur-r_0.602-webfont.svg#VegurRegular') format('svg');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family:'Vegur';
    src:url('../fonts/vegur-m_0602-webfont.eot');
    src:url('../fonts/vegur-m_0602-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/vegur-m_0602-webfont.woff') format('woff'), 
        url('../fonts/vegur-m_0602-webfont.ttf') format('truetype'), url('../fonts/vegur-m_0602-webfont.svg#VegurMedium') format('svg');
    font-weight:bold;
    font-style:normal;
}
/* layout */
html, body {
	height:100%;
}
body {
	margin:0;
	padding:0;
	background:url(../images/bg.jpg) 0 0 repeat-x #e5e8eb;
	font-family:'Vegur', Arial, Helvetica, sans-serif;
	font-size:13px;
	line-height:20px;
	color:#2F2B2B;
}
.container {
	position:relative;
	min-height:100%;
	background:url(../images/header_bg.jpg) center 0 no-repeat;
}
.header {
	width:900px; /* 940 */
	height:150px;
	margin:0 auto;
	padding:0 20px;
	background:url(../images/header_bg.jpg) center 0 no-repeat;
}
.header .logo {
	float:left;
	display:block;
	background:url(../images/logo.png) 0 0 no-repeat;
    width:230px;
	height:131px;
	margin-top:12px;
}
.header .user {
	color:#fff;
	font-weight:bold;
	font-size:14px;
	float:right;
	padding-top:12px;
	max-width:650px;
	text-shadow:1px 1px 0 #000;
	text-align:right;
}
.header .user a {
	color:#fff;
}
.nav {
	background:url(../images/header_bg.jpg) center bottom no-repeat;
	height:32px;
	width:900px;
	margin:0 auto;
	padding:0 20px;
}
.nav ul {
	list-style:none;
	padding:0;
	margin:0;
	line-height:32px;
	text-shadow:1px 1px 0 #373636;
}
.nav ul li {
	float:left;
	position:relative;
}
.nav a {
	font-size:18px;
	color:#fff;
	margin-right:30px;
	font-weight:bold;
}
.nav a:hover, .nav li.selected a {
	color:#0d3198;
	text-decoration:none;
}
.section {
	width:940px;
	margin:40px auto 0;
}
.section.with_bg {
	background:url(../images/text_bg_large.png) center bottom no-repeat;
	padding:20px 40px 40px;
	width:860px;
}
.section.with_bg, .section.center {
	margin-top:10px;
}
.section.center {
	text-align:center;
	margin-left:auto;
	margin-right:auto;
	width:728px;
}
.section.center a {
	display:block;
	line-height:0;
}
.section.with_bg ul, .section .main ul {
	margin:0 0 0 20px;
	list-style:none;
	padding:0;
}
.section.with_bg ul li, .section .main ul li {
	padding:0;
	text-indent:20px;
	background:url(../images/bullet_blue.png) 6px 7px no-repeat;
}
.section.with_bg .title, .section .main .title {
	padding-bottom:10px;
}
.section .main {
	background:url(../images/text_bg.png) center bottom no-repeat;
	padding:0 40px 40px;
	width:620px;
	float:left;
	margin-right:-20px;
}
.sidebar {
	float:right;
	width:240px;
}
.sidebar .widget {
	background:#f3f3f3;
	padding:10px 20px;
	-webkit-box-shadow:0 1px 1px 0 #a2a3a6;
    box-shadow:0 1px 1px 0 #a2a3a6;
	margin-bottom:20px;
	position:relative;
}
.widget .ribbon {
	position:absolute;
	top:-4px;
	right:16px;
}
.sidebar .widget.no_bg {
	background:none;
	padding:0;
	box-shadow:none;
	-webkit-box-shadow:none;
}
.widget.banners {
	margin-top:-4px;
	margin-left:-8px;
	float:right;
}
.widget.banners a {
	float:left;
	margin:4px 0 0 4px;
	display:block;
}
.widget.with_border a {
	border:#f3f3f3 solid 5px;
}
.widget.with_border a:hover {
	border-color:#0D3198;
}
.widget.banners a img {
	float:left;
}
.title {
	color:#0d3198;
	font-family:'Stanberry', Verdana, Geneva, sans-serif;
	font-size:18px;
	text-shadow:1px 1px 0 #fff;
	line-height:26px;
}
.section span {
	font-weight:bold;
}
.subtitle {
	font-size:14px;	
	font-family:'Stanberry', Verdana, Geneva, sans-serif;
	color:#0d3198;
	text-shadow:1px 1px 0 #fff;
}
.btn_l {
	background:url(../images/btn_l.png) 0 0 no-repeat;
	width:5px;
	height:29px;
	float:left;
}
.btn_r {
	background:url(../images/btn_r.png) 0 0 no-repeat;
	width:5px;
	height:29px;
	float:left;
}
.btn_m {
	background:url(../images/btn_m.png) 0 0 repeat-x;
	height:29px;
	float:left;
}
.btn_m a {
	line-height:27px;
	font-family:'Stanberry', Verdana, Geneva, sans-serif;
	font-size:14px;
	color:#f3f3f3;
	display:block;
	text-align:center;
	margin:0 -5px;
	padding:0 25px 0 30px;
}
.sidebar .btn_m a {
	padding:0;	
	width:200px;
}
.btn_m a:hover {
	text-decoration:none;
}
.btn_hover .btn_l, .btn_hover .btn_m, .btn_hover .btn_r {
	background-position:0 -29px;
}
/* footer */
.footer_bg {
	bottom:0;
	position:absolute;
	width:100%;
	background:url(../images/footer_bg.jpg) 0 0 repeat-x #878383;
}
.footer {
	margin:0 auto;
	width:900px;
	padding:0 20px;
	background:url(../images/footer_bg.jpg) 0 0 repeat-x #878383;
	color:#5d5f62;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	height:40px;
}
.footer .left {
	font-family:'Vegur', Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:15px;
	color:#2f2b2b;
	padding:10px 0;
	line-height:20px;
	text-shadow:1px 1px 0 #b8b5b5;
}
.footer .left a {
	color:#2f2b2b;
}
.footer .right {
	text-align:right;
	padding:6px 0;
	line-height:14px;
}
/* general styles */
a {
	color:#0d3198;
	text-decoration:none;
	-webkit-transition: all 0.2s ease-out;  /* Saf3.2+, Chrome */
    -moz-transition: all 0.2s ease-out;  /* FF4+ */
    -ms-transition: all 0.2s ease-out;  /* IE10 */
    -o-transition: all 0.2s ease-out;  /* Opera 10.5+ */
    transition: all 0.2s ease-out;
}
a:hover {
	text-decoration:underline;
}
a img {
	border:none;
}
form {
	margin:0;
}
p {
	margin:0;
	padding:10px 0;
}
.left {
	float:left;
}
.right {
	float:right;
}
.clr {
	clear:both;
}
.ie6fix {
	font-size:0px;
	height:0px;
	overflow:hidden;
}
.h5 {
	padding-top:5px;
}
.h10 {
	padding-top:10px;
}
.h60 {
	padding-top:60px;
}
/* form */
.jqTransformInputWrapper.error {
	background-position:0 -93px;
}
.jqTransformInputWrapper.error .jqTransformInputInner {
	background-position:right -93px;
}
.jqTransformTextarea.error td#jqTransformTextarea-tl{background-position:0px -15px;}
.jqTransformTextarea.error td#jqTransformTextarea-tm{background-position:0px -15px;}
.jqTransformTextarea.error td#jqTransformTextarea-tr{background-position:0px -15px;}
.jqTransformTextarea.error td#jqTransformTextarea-ml{background-position:-15px 0px;}
.jqTransformTextarea.error td#jqTransformTextarea-mm{background:#ffe0e0;}
.jqTransformTextarea.error td#jqTransformTextarea-mr{background-position:-15px 0px;}
.jqTransformTextarea.error td#jqTransformTextarea-bl{background-position:0px -15px;}
.jqTransformTextarea.error td#jqTransformTextarea-bm{background-position:0px -15px;}
.jqTransformTextarea.error td#jqTransformTextarea-br{background-position:0px -15px;}
.main .form .submit, .main .form .jqTransformInputWrapper, .main .form .jqTransformSelectWrapper, .form .label, .main .form 
        .btn, .main .form label, .main .form .jqTransformCheckboxWrapper, .main .form .jqTransformRadioWrapper {
	margin-top:10px;
}
.form .label {
	line-height:15px;
	width:130px;
	padding:8px 0;
	float:left;
	margin-right:5px;
	display:block;
	font-weight:bold;
}
.form span.label {
	width:auto;
}
span.jqTransformCheckboxWrapper a, span.jqTransformRadioWrapper a {
	-webkit-transition:none;  /* Saf3.2+, Chrome */
    -moz-transition:none;  /* FF4+ */
    -ms-transition:none;  /* IE10 */
    -o-transition:none;  /* Opera 10.5+ */
    transition:none;
}
.main .form .table .jqTransformCheckboxWrapper, .main .form .table .jqTransformCheckbox, .main .form .table .jqTransformInputWrapper, 
        .main .form  .table .jqTransformSelectWrapper, .form  .table .label, .main .form .table .btn, .main .form .table .submit {
	margin-top:0;
	margin-right:0;
}
input[type="text"] {
	width:190px;
}
.fancybox-wrap input[type="text"] {
	clear:both;
}
input[type="text"].small {
	width:70px;
}
select {
	min-width:171px;
}
textarea {
	width:600px;
}
select.inherit {
	min-width:inherit;
}
.main .btn {
	float:left;
	margin-right:6px;
}
.main .form .table .btn.marginr {
	margin-right:6px;
}
.main .form .jqTransformSelectWrapper, .main .form .jqTransformInputWrapper {
	margin-right:10px;
}
.fb-login-button {
	padding-top:12px;
}
/* accordion */
.accordion {
	padding-bottom:20px;
}
.question {
	background:url(../images/arrow_blue.png) 6px 5px no-repeat;
	padding-left:32px;
	margin-top:14px;
	cursor:pointer;
}
.question.active {
	background-position:6px -185px;
}
.answer {
	padding-left:32px;
	padding-top:10px;
}
/* img in text */
.main img {
	background:#f3f3f3;
	-webkit-box-shadow:0 1px 1px 0 #a2a3a6;
    box-shadow:0 1px 1px 0 #a2a3a6;
	margin-bottom:10px;
}
.main img.left {
	margin-right:20px;
}
.main img.right {
	margin-left:20px;
}
/* Logged In */
.nav ul ul {
	position:absolute;
	background:#6C6867;
	display:none;
	left:0;
	top:32px;
	z-index:2;
}
.nav li li {
	font-size:12px;
	line-height:20px;
	float:none;
	border-bottom:#999 solid 1px;
}
.nav ul ul a {
	font-size:12px;
	font-weight:normal;
	padding:2px 5px;
}
.nav li.selected li a {
	color:#fff;
}
.nav li.selected li.selected a, .nav li.selected li a:hover {
	color:#0d3198;
}
/* for right submenu if needed */
.nav ul.right a {
	margin-right:0px;
	margin-left:30px;
}
.nav ul.right ul a {
	margin-right:30px;
	margin-left:0;
}
.nav ul.right ul {
	left:30px;
}
/* -- */
/* User Deashboard (home) */
.sep {
	font-size:0px;
	line-height:0px;
	border-bottom:#999 solid 1px;
	margin-bottom:10px;
	clear:both;
}
.img_shadow {
	background:#f3f3f3;
	-webkit-box-shadow:0 1px 1px 0 #a2a3a6;
    box-shadow:0 1px 1px 0 #a2a3a6;
	margin-bottom:10px;
}
.section .main ul {
	margin:0 0 10px;
}
/* Tables */
.table {
	text-align:left;
	border-bottom:1px solid #999;
	border-left:1px solid #999;
    border-collapse:collapse;
}
.table th {
	background:#999;
}
.table td, .table th {
	border-top:1px solid #999;
	border-right:1px solid #999;
	padding:5px;
}
.table .subject {
	cursor:pointer;
}
#messages_form .buttons {
	margin-right:-4px;
	padding-top:10px;
}
/* uploader */
#file-upload img {
	margin:10px 10px 0 0;
}
/* login */
#login_box {
	width:200px;
	padding-left:3px;
}
/* tabs */
.section .main .tabs > ul, .tabs > ul {
	margin:0 0 10px;
	padding-top:10px;
	width:100%;
	border-bottom:#999 solid 1px;
	height:30px;
}
.section .main .tabs > ul li, .tabs > ul li {
	color:#fff;
    list-style:none;
	background:none #6C6867;
    padding:5px 8px;
    float:left;
	border:#999 solid 1px;
	border-bottom:none;
	text-indent:0;
	cursor:pointer;
	text-shadow:1px 1px 0 #000;
}
.section .main .tabs > ul li.active, .tabs > ul li.active {
    background-color:#0D3198;
}

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I never liked the "/faces/" URL convention. Aside from making the URL path longer, it makes it too easy for people to confuse URLs and resource paths. I prefer URLs in the form of "http://localhost:8080/OHP-Site/index.jsf".

When you get stuff on a web page that isn't in the View Definition, such as H1-style captions and images, I have to conclude that one of 3 things is happening:

1. You aren't retrieving from the server you think you are or you're not accessing the webapp you think you are.

2. You are retrieving from the right server, but you're retrieving stale data. Which is why when I use Tomcat, I make a point of cleaning out the temp, work and log directories when re-deploying.

3. You are getting you view definition from an intermediary that is decorating it. Most commonly that would be because there was some sort of "tiling" mechanism at work, but custom login processors often muck around with user requests, which means that anything could be happening.

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I am certain that 1 and 2 are not issues here. When I make changes to the code and restart the server, that changes are immediately visible, including the name/no name change. Therefore, I am clearly connecting to that server and getting the latest data.

As far as an intermediary, I'm not sure what you mean. My "custom login processor" is one line that returns the String "success" so that the navigation rule in faces-config.xml will send the user off to another page. It doesn't even check what was entered in those fields.

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

OK. Next question is what does the "success" navigation rule look like. Because if the login screen isn't coming through an interception and it contains text and image items that aren't in the login View Definition, there's almost got to be something tiling it.

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Once again, it all works as long as there is a name attribute in that button. If there was a problem with the navigation rule itself, I wouldn't imagine it would ever work at all. By the way, it has nothing to do with the wild card. I just changed it to that.

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

You can omit the "from-view" ID if you want a universal match. No need for a wildcard.

Next question. Is user.xhtml the actual file you posted or is it another resource that doing something like a ui:include?

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

ah ok thanks for the navigation rule tip

user.xhtml is just another page in the WebContent folder

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

OK, but how does index.html (or whatever page your login form is on) get pulled in?

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Sorry, I don't understand your question. There are two pages in WebContent: index.xhtml and user.xhtml. If I navigate to index.xhtml (http://localhost:8080/OHP-Site/faces/index.xhtml) and press the login button, I'm taken to user.xhtml ( http://localhost:8080/OHP-Site/faces/user.xhtml)

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

OK. Then I am going to understand that to mean that the page with the login form that you posted is index.html. Technically, that's the page whose resource path is /index.html and I won't worry about its URL just yet.

The problem I'm having is that the sample View Definition you gave not only seems to lack a graphics tag - whether raw HTML or JSF - but also doesn't match your sample screen in that the sample screen has a boldface large-print page title on it that isn't accounted for on your View Definition.

JSF doesn't just make stuff like that up, so where does it come from?

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I'm not sure what a graphics tag is so please tell me what to look for and I'll see if I can find it.

Right above that form there is:

Didn't think that was important so didn't post that part.

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

At think at this stage, it's all important, since there are some other critical constructs that I've been assuming were there and maybe they aren't.

The JSF equivalent of the HTML <IMG> tag is <h:graphicImage> BTW.

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

right. There is nothing like that. If you look at the css file I posted starting at line 199, I think you may find where the graphics are coming from. I know very little about css but it looks to me like that's defining images to use for buttons.

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I think the problem is clearly that JSF is rendering it as type="image" when it should be rendering it as type="submit" and just let the css do its job.

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I can work my way towards that, but if you don't have the proper JSF view tags wrapping the h:form, the page will generally neither render nor respond properly, which is why I wanted to see the entire thing and not just the form.

Unless I'm being blind (again

), there is no "name=" attribute for the JSF commandLink tag. However, I do recommend putting 'id=" attributes on your form and input control elements. Otherwise JSF will generate internal automatic IDs that are hard to use for debugging.

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Here's the whole thing. I have to get some sleep. maybe the answer will come to me in a dream :-)

<ui:composition template="template.xhtml"
    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">

<ui:define name="title">
        Online Home Poker
    </ui:define>

<ui:define name="links">
		<link rel="stylesheet" href="css/style.css" type="text/css" />
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
		<link rel="stylesheet" href="slider/slider.css" type="text/css" />
		<script type="text/javascript" src="slider/jquery.cycle.all.js"></script>
		<script type="text/javascript" src="js/scripts.js"></script>
		<link rel="stylesheet" type="text/css" href="jqtransformplugin/jqtransform.css" />
		<script type="text/javascript" src="jqtransformplugin/jquery.jqtransform.js"></script>
		<script type="text/javascript" src="js/form_validator.js"></script>
		<script type="text/javascript" src="fancybox/jquery.fancybox.pack.js?v=2.0.6"></script>
		<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox.css?v=2.0.6" media="screen" />
		
    </ui:define>

<ui:define name="content">
        <div class="section">
            <div id="slider_bg"><div id="shslideshow">
                <div id="slide">
                    <div class="slide">
                        <a href="register.xhtml" title="Sign Up Now!"><img src="images/slide1.jpg" title="Sign Up Now!" alt="slide1" /></a>		
                        <div class="text"><h2>Sign Up Now!</h2><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy
 nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p></div>
                    </div>
                    <div class="slide">
                        <img src="images/slide2.jpg" alt="slide2" />
                    </div>
                    <div class="slide">
                        <a href="register.xhtml" title="Sign Up Now! It's Free!" target="_self"><img src="images/slide3.jpg" title="Sign Up Now!" alt="slide3" /></a>
                        <div class="text"><h2>Sign Up Now! It's Free!</h2><p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit
 lobortis nisl ut aliquip ex ea commodo consequat.</p></div>
                    </div>
                </div>
                <div id="shslideshow_nav">
                    <div id="shslideshow_nav_pre"></div>
                    <div id="shslideshow_nav_next"></div>
                </div>
                <div class="clr"></div>
            </div></div>
            <div class="sidebar">
                <div class="widget">
                    <div class="title">Member Login</div>
                    <h:form class="form" id="login_form2" name="login_form2">
                    	<h:inputText styleClass="required" title="Email" id="email2" name="email2" value="#{userController.user.name}" style="width:190px" />
                        <h:inputSecret styleClass="required" title="pwpw" id="password2" name="password" value="#{userController.user.password}" style="width:190px" />
                    	<h:commandButton value="Login" name="k" action="#{userController.login}" id="submit"/>
						<h:outputText value="#{userController.loginError}" style="color: #FF0000"/>
					</h:form>
                </div>
                <div class="widget">
                	<img src="images/ribbon.png" width="37" height="52" alt="Free" class="ribbon" />
                    <div class="title">Free Registration</div>
                    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod</p>
                    <div class="btn">
                    	<div class="btn_l"> </div>
                        <div class="btn_m"><a href="register.xhtml">Sign Up Now</a></div>
                        <div class="btn_r"> </div>
                        <div class="clr"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="clr"></div>
        <div class="section section_large with_bg">
            <div class="title">Features List</div>
            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam
 erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. 
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
            <p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat:</p>
            <ul>
                <li>Vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui</li>
                <li>Blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option
 congue nihil imperdiet doming id quod mazim placerat facer possim assum</li>
                <li>Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem Eodem modo typi, qui nunc nobis videntur 
parum clari, fiant sollemnes in futurum.</li>
            </ul>
            <p>Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui 
sequitur mutationem consuetudium lectorum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod 
tincidunt ut laoreet dolore magna aliquam erat.</p>
        </div>
        <div class="ie6fix h60"> </div>
    </ui:define>
</ui:composition>

template:

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Thanks. You don't have f:view tags, although for JSF2 they are no longer mandatory.

I do recommend using explicit id attributes, since like I said, you get more meaningful debug messages.

The broken image is probably because your relative URL was relative to the JSF "/faces/" URL, and CSS shouldn't be going through that. Another reason why I prefer the ".jsf" URL format convention over the "/faces/" convention.

I think that the navigation action is probably the usual confusion between URL paths and resource paths, but we'll look at that tomorrow.

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

So I changed the mapping to *.jsf

Now instead of getting the error when I press the button with no name attribute, the entire form just disappears.

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Just to be clear, your navigation rule should look something like this:

Assuming that it does and that your debugger indicates that the JSF Action method named "login" is being successfully invoked, then a blank page would indicate that there is something wrong with the user.xhtml View Definition file. Unlike Struts which can be annoyingly fond of displaying blank pages when there is failure in the form-processing code, JSF normally only presents blank pages when the page definitions themselves are at fault, so replacing this file with a simpler definition usually verifies that you're navigating to the right place. Once you're satisfied with that, you should be able to build up the page a piece at a time.

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Are you sure about that first part? I don't think that's the case. Eclipse's built in faces-config editor does not do it that way, and it's hard to believe they would make such an egregious error. I changed it anyway and it made it do all kinds of weird things like ignore the template when redirected. I changed it back to .xhtml in the navigation rule.

Just to be clear, user.xhtml displays fine when I navigate to http://localhost:8080/OHP-Site/user.jsf
It also displays fine when redirected there by that form (when the name attribute is present making the form work at all)

It seems to me then unlikely that the definition of user.xhtml is at fault. It's more likely a problem that occurs in the postback before it even tries to redirect?

I'd also like to reiterate that it works fine (but renders wrong) if there is a name attribute in the tag. There is a clue there that seems to be getting ignored. And yes I realize there is no name attribute in commandButton which makes this even more mysterious.

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I'm afraid that the Eclipse faces-config editor isn't very impressive. That particular example was snipped from a very old and very functional project. On the whole, in fact, Eclipse support for JSF is less than exciting. I tend to ignore most of what it does provide, although they've apparently finally got a semi-decent approximation to WYSIWYG view definition editing working in Eclipse Indigo. And it actually seems to be working. Even simple XML editing was a problem for longer than I want to recall.

A navigation rule consists of one or more source patterns and a destination URL or "view-id", which is relative to the webapp context root. You can make a rule global by supplying just a target name (for example, "Home"), or you can narrow its scope to a given source view(s) and/or a given action method. Prior to JSF2, I usually defined rules for my actions linked to results of "success", "failure", and occasionally specific types of success or failure, and so my preferred approach was to scope by action method name, since success on one action might not lead to the same destination as success on a different action.

Normally, a code Exception will dump a stacktrace. not a blank page. A botched navigation (misspelled target view id, bad name, usw. would cause the index.jsf to redisplay, since the default is not to navigate. Only a navigation to a page which doesn't render should give a blank page.

Of course, a blank page isn't always really blank, so it's always wise to use the browser's View Page Source function in case there are clues there. I like to put comments in my view templates so that I'll know if the proper view was being processed.

Views that include other views are a specific case where you can be presented with a blank page if the included view has a problem rendering and that particular situation can be a

to debug.

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

In any case, it seems to work fine in general when I leave it as .xhtml, and not work fine if I change it to .jsf so I'll just keep it. I have actually used the *.jsf mapping on the other test projects I made while learning jsf 2.0 and never changed the navigation rules to say .jsf instead of .xhtml and never had an issue.

but I did discover it is not ever invoking the login() method when the name attribute is not present, which is the issue at hand. hmm...

Elie Steckruebe

Greenhorn

Posts: 26

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I found the entire problem.

It was this bit of javascript code in an included script file:

This worked fine when the pages were just html, but something about how jsf rendered it, made this screw everything up. I can't even find where that form() function is and have no idea what it does because everything seems to be working fine by just removing those lines.

By the way, do you have any good places to get started with that J2EE security framework you talked about? The next thing I need to do is actually implement a real login.

Tim Holloway

Saloon Keeper

Posts: 27496

195

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Ouch! Nothing worse than finding that everything you thought was OK has been silently sabotaged.

J2EE container-managed security is covered in just about any decent introductory text on J2EE. Unfortunately, they usually then go and confuse the issue by showing a sample app with a user-written login process.

Since even user-designed security systems usually have enough wit to use SSL, there's usually a section on setting up transport security in web.xml. A properly thorough text will then cover URL patterns and roles.

The J2EE standard security system is primarily wrapped around the webapp rather than coded into it. That means that less coding is required and many exploits will be turned away by the server without every being able to interact with application code at all, thereby ensuring that application bugs cannot be exploited.

The heart of this architecture is based on secured URL patterns and security roles, both of which you define and associate in web.xml. If an incoming URL request matches one of the defined patterns, then the server checks to see if the user is logged in. If the user is not logged in, the server intercepts the request, sidelines it, presents the login page defined in web.xml (this must be a straight HTML or JSP form, JSF doesn't work here), then (assuming the user logged in) resumes the sidelined request as though nothing had happened. If the request requires a role that the user doesn't possess, the server rejects the request, instead.

You can also augment this system in application code where needed using the HttpServletRequest method isUserInRole() to query for authorization. I do this, for example, when a URL can handle multiple roles, but only some roles are allowed to update data. Also available on the HttpServletRequest are the userName and userPrincipal properties. userPrincipal isn't much use directly, but it holds the userName, as supplied to the login service. The userName method is a shortcut way to retrieve this.

The actual configuration of userids, passwords and roles is done external to the web application, typically using a plug-in security services provider called a Realm. Most common J2EE servers come with support for many different types of Realms. For example, among those available for the Tomcat server are the MemoryRealm, which is a crude service that uses an XML user/role configuration file and is good for testing, the JDBCRealm, which authorizes and authenticates using a database, and the LDAPRealm, which uses an LDAP server such as Microsoft's Active Directory. The webapp neither knows nor cares which Realm is in use, so it's easy to swap Realms for testing.

Because JSF abstracts the underlying server and transport mechanisms. if you need any of the properties and functions available from the HttpServletRequest, you have to dig through JSF's FacesConfig to get it. Rather than splatter a lot of JSF-specific code all over my webapps, I prefer to isolate this functionality into a security manager object, which can be at session or application scope, depending on whether I want my security manager to hold additional security information of its own or simply statically access the HttpServletRequest security features. So I can say "if ( userSecurity.inRole(UserSecurity.ROLE_AUDITOR)) ...".

One thing to be aware of in JSF, however. The container-managed security system secures URLs, not resources. That's an important thing to know, since in JSF, the URL paths don't always track the resource paths. To ensure that there are no security holes introduced on this account, use the "<redirect/>" navigation element to force the URL to match the resource path.

There are 10 kinds of people in this world. Those that understand binary get this tiny ad:

a bit of art, as a gift, the permaculture playing cards

https://gardener-gift.com