Question

I am trying to clear all the fields in my .aspx page using javascript (Should be cross-browser). The below code is working fine for TextBox fields but not for Label fields.

var elements = document.getElementsByTagName("input");
for (var i = 0; i < elements.length; i++) {
    if (elements[i].type == "text") {
        elements[i].value = "";
    }
    else if (elements[i].type == "label") {
        elements[i].value = "";
    }
}

Later I saw that HTML is rendering asp.net Labels as span so I also tried:

else if (elements[i].type == "span") {
    elements[i].innerHTML = "";
}

Still the Labels are not being cleared. Am I doing something wrong here?

And the other problem is, whenever I refresh the page, the cleared TextBox fields are again being populated with the old values.. (really frustrating)

I am trying the above code by referring this

Please help.

Answer 1

In modern browsers, this will clear all span elements.

[].slice.call(document.querySelectorAll("span")).forEach(function(e){
    e.innerHTML="";
})

If you have applied the class “label” to your ASP labels, then you could be more specific:

[].slice.call(document.querySelectorAll(".label")).forEach(function(e){
    e.innerHTML="";
})

Here is an example that will work in older browsers:

var spans = document.getElementsByTagName("span");
for (var i=0; i < spans.length; i++)
{
    if ("label" == spans[i].className)
        spans[i].innerHTML = "";
}