Enable / disable the text field according to the option selected from the drop-down menu

Question

I want the text box to be available only if a certain option is selected in the drop-down menu and I have an html form, as shown below:

 <tr>
 <td>a.&nbsp;Did any  of your staff participate in training or orientation sessions related to any aspect of social performance management, during the reporting year? </td>
 <td >
 <p>
   <select name="mfi_4_a_i">
     <option>Yes</option>
     <option>No</option>
     <option>No, but planning in future</option>
   </select>
 </p>
 <p>if not,and not planning please explain why not </p>
 <input type="text" name="mfi_4_a_ii" id="sdd" />
 </tr>

Now, when the user selects the No option, but, planning in the future, the text field must be included, otherwise the text field must be disabled.

How to do it?

Answer 1

You must call the javascript function to do this.

<select id="mfi_4_a_i" name="mfi_4_a_i" onChange="changetextbox();">
    <option>Yes</option>
    <option>No</option>
    <option>No, but planning in future</option>
</select>

<input type="text" name="mfi_4_a_ii" id="sdd" />

<script type="text/javascript">
function changetextbox()
{
    if (document.getElementById("mfi_4_a_i").value === "noy") {
        document.getElementById("sdd").disable='true';
    } else {
        document.getElementById("sdd").disable='false';
    }
}
</script>

Answer 2

It did document.getElementById("sdd").disabled='false'n’t work for me , so I used

document.getElementById("sdd").disabled='';

if (document.getElementById("mfi_4_a_i").value === "noy") {
    document.getElementById("sdd").disabled='true';
} else {
    document.getElementById("sdd").disabled='';
}

Answer 3

Just fixes ... delete ;, ===, noy, 'true' #n quotes

onChange="changetextbox();"
if (document.getElementById("mfi_4_a_i").value == "no") {
document.getElementById("sdd").disabled=true;

Answer 4

Without going back to the server, you will need to do this using javascript

Answer 5

document.getElementById("the_id").disabled='';works for me. works likestyle.display