php - Multiple Radio button with text input -


how can enable input type=text if "other" radio button clicked.

<tr><td><font color='red' size='3'>*</font>civil status</td><td>:</td><td><input type='radio' name='civstat' value='single' required='required'> single                                      <br><input type='radio' name='civstat' value='married' required='required'> married                                      <br><input type='radio' name='civstat' value='annuled' required='required'> annuled                                      <br><input type='radio' name='civstat' value='widowed' required='required'> widowed                                      <br><input type='radio' name='civstat' value='seperated' required='required'> seperated                                      <br><input type='radio' name='civstat' required='required' onclick='civstattxton()'> others,                                      please specify here<input type='text' name='civstat' id='civstaton'></td>                                     </tr> 

you can use javascript disable/enable input based on onclick event of each input. it's pretty messy gets job done:

  <tr><td><font color='red' size='3'>*</font>civil status</td><td>:</td><td><input type='radio' name='civstat' value='single' required='required'  onclick='document.getelementbyid("civstaton").setattribute("disabled","disabled");document.getelementbyid("civstaton").value = "";'> single                                  <br><input type='radio' name='civstat' value='married' required='required'  onclick='document.getelementbyid("civstaton").setattribute("disabled","disabled");document.getelementbyid("civstaton").value = "";'> married                                  <br><input type='radio' name='civstat' value='annuled' required='required'  onclick='document.getelementbyid("civstaton").setattribute("disabled","disabled");document.getelementbyid("civstaton").value = "";'> annuled                                  <br><input type='radio' name='civstat' value='widowed' required='required'  onclick='document.getelementbyid("civstaton").setattribute("disabled","disabled");document.getelementbyid("civstaton").value = "";'> widowed                                  <br><input type='radio' name='civstat' value='seperated' required='required' onclick='document.getelementbyid("civstaton").setattribute("disabled","disabled");document.getelementbyid("civstaton").value = "";'> seperated                                  <br><input type='radio' name='civstat' required='required' onclick='document.getelementbyid("civstaton").removeattribute("disabled");'> others,                                  please specify here<input type='text' name='civstat' id='civstaton' disabled></td>                                 </tr> 

here demo: jsbin

i recommend using library jquery attach event handler radio buttons instead of messy inline solution.


Comments

Popular posts from this blog

linux - Does gcc have any options to add version info in ELF binary file? -

android - send complex objects as post php java -

charts - What graph/dashboard product is facebook using in Dashboard: PUE & WUE -