?
Solved

jquery errorPlacement

Posted on 2014-09-25
3
Medium Priority
?
196 Views
Last Modified: 2014-10-01
I am trying to do a jquery validation and place the error message next to the field. Currently it goes after the field. I am using a table structure. So it goes in the same cell as a form element. What I want to do is may be creating a separate cell


 errorPlacement: function(error, element) {

   				if (element.attr('type') === 'radio') {
			      error.insertAfter(
          		  element.siblings('input[type="radio"][name="' + element.attr('name') + '"]:last'));
   				}else {
			      error.insertAfter(element);
   				}


<td>
<input id="firstname" class="error" type="text" required="" value="" name="firstname" maxlength="50" size="20">
<div class="error" htmlfor="firstname" generated="true">Please enter the First Name.</div>
</td> 

Open in new window

0
Comment
Question by:erikTsomik
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
3 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 2000 total points
ID: 40344110
use a span instead a div line 13
0
 
LVL 19

Author Comment

by:erikTsomik
ID: 40344162
That is better but now the error messages does not wrap if they exceed the length they are going to a different line. can i specify the width.

here is my css

#register span.error {
 	background: none repeat scroll 0 0 red;
    border: 2px solid #fff;
    border-radius: 7px;
    box-shadow: 12px 0 7px #000;
    color: #fff;
    margin: 0;
    opacity: 0.7;
    padding: 5px 10px;
    /*position: absolute;*/
    right: -60px;
    top: -92px;
}
#register span.error:before {

position:absolute;
bottom:-36px;
height:36px;
}

Open in new window

0
 
LVL 82

Expert Comment

by:leakim971
ID: 40344379
no, but you can give it more width with it's parent, so change the width of its parent container
0

Featured Post

Get real performance insights from real users

Key features:
- Total Pages Views and Load times
- Top Pages Viewed and Load Times
- Real Time Site Page Build Performance
- Users’ Browser and Platform Performance
- Geographic User Breakdown
- And more

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
Suggested Courses

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question