On select disable text fields

Question

У меня есть форму, как показано ниже, если я выберу company из раскрывающегося списка отключить collegename, course и year. Если я выберу college, отключите company name и date of join. Пожалуйста, помогите в этом. Мне нужна помощь в том, чтобы отключить текстовые поля, когда мы выбираем значение из выпадающего

<form name="form" method="post" action="" onSubmit="submit;"> 
<center><table border="1" cellspacing="0" style="width:650px"> 

<tr> 
<td><b>Name</td> 
<td><input type="text" name="name"></td></tr> 

<tr> 
<td><b>Father Name</td> 
<td><input type="text" name="fname"></td></tr> 


<tr><td><b>Gender</td> 
<td><select name="gender"> 
<option value="na">Select</option> 
<option value="Male">Male</option> 
<option value="Female">Female</option> 
</td></tr> 

<tr> 
<td><b>Email</td> 
<td><input type="text" name="email"></td></tr> 

<tr> 
<td><b>Date Of Birth</td> 
<td><input type="text" name="date" id="datepicker" required></td></tr> 

<tr> 
<td><b>Mobile Number</td> 
<td><input type="text" name="mn"></td></tr> 

<tr> 
<td><b>Parent Number</td> 
<td><input type="text" name="pn"></td></tr> 

<tr> 
<td><b>Address</td> <td><textarea name="address" rows="3" cols="50"></textarea></td> 
</tr> 

<tr> 
<td><b>Coll/Comp ID Num</td> 
<td><input type="text" name="idnum"></td></tr> 

<tr><td><b>Company/College</td> 
<td><select name="ccname"> 
<option value="na">Select</option> 
<option value="company">Company</option> 
<option value="college">College</option> 
</td></tr> 

<tr> 
<td><b>College Name</td> 
<td><input type="text" name="colname"></td></tr> 

<tr> 
<td><b>Course</td> 
<td><input type="text" name="course"></td></tr> 

<tr> 
<td><b>Year</td> 
<td><input type="text" name="year"></td></tr> 

<tr> 
<td><b>Company Name</td> 
<td><input type="text" name="comname"></td></tr> 

<tr> 
<td><b>Date Of Join</td> 
<td><input type="text" name="doj" id="datepicker" required></td></tr> 


<tr> 
<td colspan="2" align="center"><input type="submit" name="submit" value="submit"/></td> 
</tr></center> 
</table> 
    </form> 

Answer 1

Use some thing like this if you have problem tell me 


<script> 
     function getccname(val) 
{ 
    if(val == 'company') 
    { 
    document.getElementById("colname").disabled = true; 
    document.getElementById("course").disabled = true; 
     document.getElementById("year").disabled = true; 
    } 
    else if(val == 'college') 
    { 
     document.getElementById("comname").disabled = true; 
       document.getElementsByName("doj")[0].disabled = true; 
     document.getElementById("colname").disabled = false; 
       document.getElementById("course").disabled = false; 
     document.getElementById("year").disabled = false; 

    } 
    else 
    { 
     document.getElementById("comname").disabled = false; 
        document.getElementsByName("doj")[0].disabled = false; 
     document.getElementById("colname").disabled = false; 
       document.getElementById("course").disabled = false; 
     document.getElementById("year").disabled = false; 

    } 

} 

</script> 
<form name="form" method="post" action="" onSubmit="submit;"> 
<center><table border="1" cellspacing="0" style="width:650px"> 

<tr> 
<td><b>Name</td> 
<td><input type="text" name="name"></td></tr> 

<tr> 
<td><b>Father Name</td> 
<td><input type="text" name="fname"></td></tr> 


<tr><td><b>Gender</td> 
<td><select name="gender"> 
<option value="na">Select</option> 
<option value="Male">Male</option> 
<option value="Female">Female</option> 
</td></tr> 

<tr> 
<td><b>Email</td> 
<td><input type="text" name="email"></td></tr> 

<tr> 
<td><b>Date Of Birth</td> 
<td><input type="text" name="date" id="datepicker" required></td></tr> 

<tr> 
<td><b>Mobile Number</td> 
<td><input type="text" name="mn"></td></tr> 

<tr> 
<td><b>Parent Number</td> 
<td><input type="text" name="pn"></td></tr> 

<tr> 
<td><b>Address</td> <td><textarea name="address" rows="3" cols="50"></textarea></td> 
</tr> 

<tr> 
<td><b>Coll/Comp ID Num</td> 
<td><input type="text" name="idnum"></td></tr> 

<tr><td><b>Company/College</td> 
<td><select name="ccname" onchange="getccname(this.value);"> 
<option value="na">Select</option> 
<option value="company">Company</option> 
<option value="college">College</option> 
</td></tr> 

<tr> 
<td><b>College Name</td> 
<td><input type="text" name="colname" id="colname"></td></tr> 

<tr> 
<td><b>Course</td> 
<td><input type="text" name="course" id="course"></td></tr> 

<tr> 
<td><b>Year</td> 
<td><input type="text" name="year" id="year"></td></tr> 

<tr> 
<td><b>Company Name</td> 
<td><input type="text" name="comname" id="comname"></td></tr> 

<tr> 
<td><b>Date Of Join</td> 
<td><input type="text" name="doj" id="datepicker"></td></tr> 


<tr> 
<td colspan="2" align="center"><input type="submit" name="submit" value="submit"/></td> 
</tr></center> 
</table> 
    </form> 

Answer 2

Позвоните в Javascript функцию с выпадающим списком, используйте что-нибудь подобное onclick="sample1();", а затем отключить текстовое поле с помощью

function sample1(){ 
    document.getElementById("textfield").disabled=true; 
}