onChange with select object

[peterb1985]

I'm trying to use the onChange event so that when other is selected from drop-down by div tag opens showing textbox.

Here's what i've got but it doesn't work:

<script language="JavaScript">
function other(){
var ind = document.frmColdCall.reason.selectedIndex;
var val = document.frmColdCall.reason.options[ind].value;
if (val == 2){
document.getElementById(rother).style.display="block";
}
if (val != 2){
document.getElementById(rother).style.display="none";
}
return true;
}
</script>

<tr>
<td></td>
<td>#recno#</td>
<td><select name="reason" onChange="other();">
<option value="0">No Answer</option>
<option value="1">Not Interested</option>
<option value="2">Other</option>
</select></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td><div id="rother" style="display:none;"><input type="text" name="other" value="" size="20" maxlength="50"></div></td>
</tr>

 

[adam0101]

Put rother in quotes:

<script language="JavaScript">
function other(){
    var ind = document.frmColdCall.reason.selectedIndex;
    var val = document.frmColdCall.reason.options[ind].value;
    if (val == 2){
        document.getElementById("rother").style.display="block";
    }
    else {
        document.getElementById("rother").style.display="none";
    }
    return true;
}
</script>

Adam

There's no place like 127.0.0.1

 

[kaht]

I made a few changes to your code and this is what I came up with. Firefox didn't like "other" as a function name for some reason, so I changed it. I also simplified your if/else block down to one line of code. Additionally, it is good practice to use document.forms["formname"].elements["objname"] when referencing form objectes. And as adam suggested, rother needs to be encapsulated in quotes:

<script language="JavaScript">
function otherFunction() {
    var ind = document.forms["frmColdCall"].elements["reason"].selectedIndex;
    var val = document.forms["frmColdCall"].elements["reason"].options[ind].value;
    document.getElementById("rother").style.display = (val == 2) ? "block" : "none";
    return true;
}
</script>

<form name="frmColdCall">
<table>
<tr>
    <td></td>
    <td>#recno#</td>
    <td><select name="reason" onChange="otherFunction();">
        <option value="0">No Answer</option>
        <option value="1">Not Interested</option>
        <option value="2">Other</option>
    </select></td>
</tr>
<tr>
    <td></td>
    <td></td>
    <td></td>
    <td><div id="rother" style="display:none;"><input type="text" name="other" value="" size="20" maxlength="50"></div></td>
</tr>
</table>
</form>

-kaht

...looks like you don't have a job, so why don't you get out there and feed Tina.

 

[adam0101]

kaht, I'm curious. Why is this:

document.forms["frmColdCall"].elements["reason"]

better than this?

document.frmColdCall.reason

This syntax works on all browsers as far as I know. What is the benefit of using the other syntax?

Adam

There's no place like 127.0.0.1

 

[cLFlaVA]

adam,

what if the name of your form was "onload"?
or the name of your element was "onsubmit"?

*cLFlaVA
----------------------------
[tt]your mom goes to college[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]

 

[peterb1985]

thanks that works

 

[kaht]

The one specific reason that pops up as a question from time to time is when people define an array of html elements that are named something like "blah[]". document.formname.blah[] will not reference the collection of elements correctly. However, document.forms["formname"].elements["blah[]"] will. I think the naming convetion using [] for the elements is a PHP thing, and I don't know PHP so I can't speak from experience. Maybe later I can dig up one of the old threads.

Additionally, I think it's one of the W3C standards, but if you look at the rest of my code I don't follow them too closely. However, I always use document.forms["formname"].elements["objname"] because I know it will always work and that prevents me from having to answer another question. (except this time )

-kaht

...looks like you don't have a job, so why don't you get out there and feed Tina.