javascript - yesno check is not working in jsp -


i have below jsp yesnocheck works slot specific search condition not working product search

<td>slot search</td> <td> <input type="radio" onclick="javascript:yesnocheck();" name="yesno" id="yescheck"/>yes   <input type="radio" onclick="javascript:yesnocheck();" name="yesno" id="nocheck"/>no <div id="ifyes" style="display:none"> slot start time: <input type='text' id='start' name='starttime'><br> slot end time: <input type='text' id='end' name='endtime'><br> </div> </td> </tr>                      <tr> <td>product search</td> <td> <input type="radio" onclick="javascript:yesnocheck();" name="yesno1" id="yescheck1"/>yes   <input type="radio" onclick="javascript:yesnocheck();" name="yesno1" id="nocheck1"/>no <div id="ifyes" style="display:none"> product number: <input type='text' id='yes' name='yes'><br> </div> </td> </tr> 

below javascript function

function yesnocheck() {     if (document.getelementbyid('yescheck').checked) {         document.getelementbyid('ifyes').style.display = 'block';     }     else document.getelementbyid('ifyes').style.display = 'none';  }   function yesnocheck1() {     if (document.getelementbyid('yescheck1').checked) {         document.getelementbyid('ifyes1').style.display = 'block';     }     else document.getelementbyid('ifyes1').style.display = 'none';  } 

what doing work here , how can enable multiple yesno check option based on user input ?

i've tided code little , added value attributes , event listener each of radio buttons.

var checkboxes = document.queryselectorall( 'input[type="radio"]' );    for(var = 0; < checkboxes.length; i++ ){  	checkboxes[i].addeventlistener( 'change', function(e){    	console.log( "you changed " + e.target.name + " option " + e.target.value );            // result if( e.target.name === slot && e.target.value === "yes" ){ ... }           });  }
<tr>    <td>slot search</td>    <td>      <input type="radio" name="slot" id="slot_yes" value="yes" />yes      <input type="radio" name="slot" id="slot_no" value="no" />no      <div id="ifyes" style="display:none">        slot start time:        <input type='text' id='start' name='starttime'>        <br> slot end time:        <input type='text' id='end' name='endtime'>        <br>      </div>    </td>  </tr>  <tr>    <td>product search</td>    <td>      <input type="radio" name="product" id="product_yes" value="yes" />yes      <input type="radio" name="product" id="product_no" value="no" />no      <div id="ifyes" style="display:none">        product number:        <input type='text' id='yes' name='yes'>        <br>      </div>    </td>  </tr>


Comments

Popular posts from this blog

node.js - Node js - Trying to send POST request, but it is not loading javascript content -

javascript - Replicate keyboard event with html button -

javascript - Web audio api 5.1 surround example not working in firefox -