Win a copy of Design for the Mind this week in the Design forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Struts 2.1 error message breaks page html formatting

 
E Robb
Ranch Hand
Posts: 111
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Im having some issues where error messages are making the page formatting of forms look odd. It essentially offsets the label from the text field so the two do not line up together.

I've tried overriding the css and it does seem to resolve the issue. Is this something I need to make custom freemarker templates for or am I missing something really simple?

I know this is not the way I should confirm / change a password for now I am just trying to get the look and feel of the error pages correct.

The first screen shot shows how the page loads the second screen shot shows how the errors throw the label and field out of alignment. Ideally I would like the error message to start over the label table cell and go to the right instead of starting over the field cell of the html and going to the right.

Here is the CSS I have tried:



Here is the actual form using theme="css_xhtml".


validation.xml:
Labels_Outof_Alignment.jpg
Labels out of alignment with validation
[Thumbnail for Labels_Outof_Alignment.jpg]
pageLoad.jpg
labels in alignment
[Thumbnail for pageLoad.jpg]
 
vanlalhmangaiha khiangte
Ranch Hand
Posts: 170
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi ,

I also got the same problem and had fixed it by following this tutorial http://www.mkyong.com/struts2/working-with-struts-2-theme-template/


Regards,
Vanlal
 
E Robb
Ranch Hand
Posts: 111
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
It looks like my html usage of css_xhtml theme was not proper which was causing the issue where the error messages were causing the labels to misalign with the text fields. I have changed my html form to the following:



Now my error messages are spanning the div correctly & the field labels are not misaligning vertically but it is changing the layout of the form. is some label I am missing to keep the elements from jumping from aligning center to aligning left?

incorrectRendering.png
[Thumbnail for incorrectRendering.png]
correctRendering.png
[Thumbnail for correctRendering.png]
 
E Robb
Ranch Hand
Posts: 111
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Was able to resolve the issue by over riding the css with the following. Now creates errors that produce a layout that is the same as the original display


security_fixed.jpg
[Thumbnail for security_fixed.jpg]
 
ss bb
Greenhorn
Posts: 2
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi I am new to code ranch

I have problem with alignment using <s:form theme="css_xhtml">

Here is my code in jsp


Here are images to describe my problem

1) I have a form here.


2) When I submit, the <s:textfield> move to the right


3) This is what I want instead


 
ss bb
Greenhorn
Posts: 2
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Problem solved. But in the first place there isn't any problem >.<

The reason why the alignment is weird is because of my IDE's default browser.
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic