Can't get document.getElementById.getElementsByTagName to work properly

Question

function confirm_results(theform) {

var inputsX = document.getElementById(theform).getElementsByTagName('textarea');
          for(var iX = 0, nX = inputsX.length - 1; iX < nX; iX++)
          {
            text += inputs[iX].innerHTML + ', ';
          }
return text;
}

Can anyone tell me why this isn't working? I'm trying to find all of the textarea's inside a DIV that I pass the name through, and return the text. Some reason it just doesn't do anything.

Answer 1

innerHTML is not the right way to read a textarea's value.

Partly because any < or & characters in it will be HTML-escaped, but mostly because the text node content inside an HTMLTextAreaElement node is not indicative of the current value of the textarea.

In fact the text node content is the original content of the textarea as seen in the HTML source. This is the same as the defaultValue property. It does not get updated when you type in the textarea... except in IE which as usual gets it all wrong.

You probably want to use inputs[iX].value instead.

The same goes for normal inputs, where input.value represents the current value but input.getAttribute('value') is the same as input.defaultValue, representing the original value put in the value="..." attribute in the HTML source. Again: except in IE due to more bugs.

The same again applies to the checked and selected properties of checkboxes and select options: the checked and selected attributes are the original values reflected in the defaultChecked and defaultSelected properties.

Also, with the length-1 you're ignoring the last textarea in the list. Do you really mean to do that?