removing a node.

[bmgz]

I have written a simple function that validates a form based on the form
objects' className attribute. The form basically write a "field
required" message next to the form element that is blank(and is
required). I have implemented all the Regex stuff onload already.

function checkRequired(varForm){
var varReturn = true;
for(var i=0; i<varForm.length; i++){
if(varForm.elements[i].className.indexOf('required') != -1 &&\
varForm.elements[i].value == ""){
varSpan=document.createElement('span');
varMsg=document.createTextNode('* This field is required!');
varSpan.appendChild(varMsg);
varSpan.setAttribute("class", "error");
varForm.elements[i].parentNode.appendChild(varSpan);
varReturn = false;
}
}
return varReturn;
}

I am having difficulty removing the new nodes I have created. Each time
I click submit, I want the nodes I created to be removed, otherwise I
just keep on appending the same message string each time. Any suggestions?

[Martin Honnen]

bmgz wrote:

I have written a simple function that validates a form based on the form
objects' className attribute. The form basically write a "field
required" message next to the form element that is blank(and is
required). I have implemented all the Regex stuff onload already.

function checkRequired(varForm){
var varReturn = true;
I don't think it makes sense to prefix any variable name with var,
instead that makes reading the code harder.
for(var i=0; i<varForm.length; i++){
if(varForm.elements[i].className.indexOf('required') != -1 &&\
varForm.elements[i].value == ""){
varSpan=document.createElement('span');
You need to somewhere store those elements you create, either use an
array that is associated with the form e.g.
varForm.validationSpans = [];
and add those spans as needed e.g.
varForm.validationSpans[varForm.validationSpans.length] = varSpan;
or associate each span with the element e.g.
varForm.elements[i].validationSpan = varSpan;
The later on you can remove those spans, removing an element is as easy as
element.parentNode.removeChild(element);
varMsg=document.createTextNode('* This field is required!');
varSpan.appendChild(varMsg);
varSpan.setAttribute("class", "error");

Doing
varSpan.className = "error"
is the preferred way as it works with both IE and other browsers while
using setAttribute with IE would require setAttribute("className", "error")
to work.
--

Martin Honnen
http://JavaScript.FAQTs.com/

[bmgz]

Martin Honnen wrote:

I don't think it makes sense to prefix any variable name with var,
instead that makes reading the code harder.
I am used to $variablename, trying to establish some new bad habits as I
am new to JS ;-)
You need to somewhere store those elements you create, either use an
array that is associated with the form e.g.
varForm.validationSpans = [];
and add those spans as needed e.g.
varForm.validationSpans[varForm.validationSpans.length] = varSpan;
or associate each span with the element e.g.
varForm.elements[i].validationSpan = varSpan;
The later on you can remove those spans, removing an element is as easy as
element.parentNode.removeChild(element);

dynamite, thanks.
varSpan.className = "error"

thanks for that, I think it was like that, then I changed it for no
particular reason..