Can I reference to a form object by its html-tag name ?

[chros]

A simplified situation, when I reference the textarea by id from the onClick() event:

<form name="news"  method="post" action="">
<textarea name="msg" cols="60" rows="15" id="msg">
<input type="button" name="b1" id="b1" value=" U " onclick="doSomething(this.form.msg)"
</form>

The doSomething() function is in an outer file.
I want my code as much as portable as it can, so I would like to refence the textarea by html-tag name: eg this.form.textarea . (because I think, in my case, 1 form has only 1 textarea). So when I copy this code to another html file, I don't have to rewrite the parameter (you may say, that it's not a problem, but when I have lot of button, it is.)

Or is there any simple solution for this ?

Thanks

[Twey]

A much better idea (and a much more portable one) would be to pass the textarea as another argument to doSomething().
However, yes, you can reference the textarea as this.form.getElementsByTagName("textarea")[0].

[mwinter]

A simplified situation, when I reference the textarea by id [...]

If a form control is placed within a form element, it's better to use the name attribute value; more portable. The id attribute is of lesser value for identification in this situation, though by all means include one for other purposes (like style sheets).

Mike

[jscheuer1]

In your example the textarea and the input tags are both invalid. The textarea has no closing tag and the input tag is malformed, no closing '>'. Try this:

<form name="news"  method="post" action="">
<textarea name="msg" cols="60" rows="15" id="msg">Hey</textarea>
<input type="button" name="b1" id="b1" value=" U " onclick="alert(this.form.elements[0].value)">
</form>

This depends upon the textarea being the first element in the form, if your function looks like so or has similar language:

<script type="text/javascript">
function alertArea(form){
for (var i_tem = 0; i_tem < form.elements.length; i_tem++)
if (form.elements[i_tem].tagName.toLowerCase()=='textarea'){
alert (form.elements[i_tem].value)
break;
}
}
</script>

It will find the first textarea in the form. Your markup could be like so:

<form name="news"  method="post" action="">
<textarea name="msg" cols="60" rows="15" id="msg">Hey</textarea>
<input type="button" name="b1" id="b1" value=" U " onclick="alertArea(this.form)">
</form>

[Twey]

<script type="text/javascript">
  function alertArea(form) {
    for (var i_tem = 0; i_tem < form.elements.length; i_tem++)
      if (form.elements[i_tem].tagName.toLowerCase()=='textarea') {
        alert (form.elements[i_tem].value)
        break;
      }
  }
</script>

However, using the native getElementsByTagName() method is more efficient.

[jscheuer1]

However, using the native getElementsByTagName() method is more efficient.

Not as x-browser.

[Twey]

True.

<script type="text/javascript">
  function alertArea(form) {
    if(typeof form.getElementsByTagName != "undefined")
      alert(form.getElementsByTagName("textarea")[0].value);
    else for (var i_tem = 0; i_tem < form.elements.length; i_tem++)
      if (form.elements[i_tem].tagName.toLowerCase()=='textarea') {
        alert (form.elements[i_tem].value);
        break;
      }
  }
</script>

[jscheuer1]

True.

<script type="text/javascript">
  function alertArea(form) {
    if(typeof form.getElementsByTagName != "undefined")
      alert(form.getElementsByTagName("textarea")[0].value);
    else for (var i_tem = 0; i_tem < form.elements.length; i_tem++)
      if (form.elements[i_tem].tagName.toLowerCase()=='textarea') {
        alert (form.elements[i_tem].value);
        break;
      }
  }
</script>

That's good, Twey - a little complicated as an example perhaps but, much more efficient looking and probably is more efficient. I am no expert on code efficiency though. I was a little worried that the OP might not be able to follow my version, hopefully, with the full discussion of this thread, what is being done will all be clear.

[Twey]

I am no expert on code efficiency though.

Nor am I, when it comes to Javascript However, a native implementation will always be faster than one written in Javascript, for the simple reason that it doesn't have to be interpreted.

[chros]

Thanks for the answers, I'll reply them in the afternoon. (It's early morning here )