0

I have finally got around to utilising jQuery form validation on a new site I am doing the coding for and even though everything is working exactly as it should I need to move one of the error messages to display below rather than to the right as the other error messages and even though I have an idea of how it is done I can't get it to work (of course I may be way off).

What I have done in the form so far is this

<p><label for="tsandcs">&nbsp;</label>
<input name="tsandcs" id="tsandcs" type="checkbox" style="width:20px;" class="required" value="<?php if (isset($_POST['tsandcs'])) { echo 'checked'; } ?>"  /> I agree to the Terms and Conditions </p>
<div id="tsandcs_error"></div>

And the JS

errorLabelContainer:("#tsandcs"),
	errorElement: "p",
	errorPlacement: function(error, element){
		error.appendTo($("div#tsandcs_error"));
	}

I really could do with some help as I need the error text to display underneath the "I agree to ....." text rather then to the right.

Edited by simplypixie: n/a

2
Contributors
12
Replies
13
Views
5 Years
Discussion Span
Last Post by Airshow
0

OK, thank you. To be honest I thought it would just move the error message into the empty div but presumably not with css formatting on that div.

0

There was no initial styling on the div and the label.error is set to float: none;. Anyway, I thought I would try adding some styling to see if I can move the text (have tried various postions, floats etc) but still nothing.

Am I right in thinking that I should be able to see the error text within the div tags when I view source if the error text is being correctly appended to the div?

0

No. View source shows the originally served HTML. It does not reflect changes made to the DOM's (ie the page's) structure or content thereafter.

To see the current state of the page, use Firefox's Firefly or Opera's Dragonfly. I think MS offer something similar for IE.

Airshow

0

I knew what you meant :) I am looking in it and none of it makes sense to me but never mind.

0

I'm sure it will be something simple. I think it's got to be CSS because the natural rendering of the HTML would be to put the <div> (block element) under <label> and <input> (inline elements).

CSS is the only thing that will change this default rendering to give a side-by-side layout.

Try suppressing CSS completely to see the whole page with default rendering. Where does the <div> now sit in relation to the <label> and <input>?

0

I have now applied some different styling to the css and things are working much better. I just need to work out how to place the last of the error messages differently to the others and I will be sorted.

0

Congratulations Simply. It's satisfying when everything all falls into place. I know the feeling.

Airshow

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.