Live Validation change output location

Question

I'm using the Live Validation Javascript library and I'm wondering how I can use it to place the feedback at the bottom of the page.

For instance, a user would input "asdf.com" in <input type="text" id="subdomain-name" name="subdomain-name">

And I would want Live-Validation to respond back "A sub-domain should not include periods." but at the bottom of the page, because otherwise it would mess up the text that is located after the box: http://puu.sh/3IxDc.jpg.

I tried to create a CSS div and then reference that as span in

createMessageSpan: function(){
    var span = document.createElement('span');
    var textNode = document.createTextNode(this.message);
    span.appendChild(textNode);
    return span;
},

but that did not work

Does it put the `span` somewhere else, or is the `span` not created at all? Are you receiving any errors in the console? — Luke Shaheen, Jul 22 '13 at 01:20
As far as I'm aware there is no console for Javascript, if there is, where is it? As for the span. As far as I'm aware the Live Validation library is putting it right after the object. — Matthew Salsamendi, Jul 22 '13 at 03:05
@MatthewSalsamendi If using Internet Explorer, just hit F12. If using Firefox, I suggest Firebug: https://getfirebug.com. This will tell you if the span is actually being created or not. — Luke Shaheen, Jul 22 '13 at 15:13
If you are not sure what the console is you should read this article: https://developer.mozilla.org/en/docs/Debugging_JavaScript — Daniel Tate, Jul 24 '13 at 04:43

score 0 · Answer 1 · answered Jul 26 '13 at 01:41

You can use jquery and the html() function. I know this isn't Live Validation but this will work.

The HTML

<html>
<head>
<script src="jquery.js"></script>
</head>
<body>
All your other html here
<div id="suggestion"></div>
</body>
</html>

The javascript

if(THE CODE THAT DETERMINES IF MESSAGE IS NECESSARY){
    $("#suggestion").html("A sub-domain should not include periods."); 
}

JsFiddle

Matthew Salsamendi · Accepted Answer · 2013-07-29T05:00:37.373

0

By using the

insertAfterWhatNode

Property I was able to do it, example:

var port = new LiveValidation("subdomain-port", {validMessage: "Port is valid", insertAfterWhatNode: "error"});

Where "error" is the element id of where you want it after.

edited Jul 29 '13 at 05:00

answered Jul 27 '13 at 20:56

Matthew Salsamendi

294
1
5
14

Live Validation change output location

2 Answers2