|
sentinel -> Dynamic Radio Box (3/18/2008 14:07:41)
|
hey all.... I am trying to implement a dynamic radio button on my form. I simply want the form to show a hidden radio box when the Option D radio box is checked. can anyone steer me in the right direction. code below: <script type="text/javascript" src="calendarDateInput.js">
</script>
<script type="text/javascript">
function show_div(div_id) {
// hide all the divs
document.getElementById('the_div_1').style.display = 'none';
document.getElementById('the_div_2').style.display = 'none';
// show the requested div
document.getElementById(div_id).style.display = 'block';
}
</script>
<link href="standard.css" rel="stylesheet" type="text/css">
<p class="fieldBlue">Holiday falls on a day other than employees regularly scheduled work day</p>
</p>
<p class="alert">Please Choose Date and Type of Time </p>
<br>
<p><form action="otinsert.asp" method="post">
<script>DateInput('OTDate', true, 'YYYY-MM-DD')</script>
<p class="tab">
<p class="tab">
<p class="tab">
<p class="tab">Employee regularly works <a href="" onClick="show_div('the_div_1'); return false;" >Wednesday through Saturday</a>, and the holiday falls on a Monday<br>
<p>
Employee regularly works <a href="" onClick="show_div('the_div_2'); return false;">Sunday through Wednesday</a>, and the holiday falls on a Monday
<p>
<p><br>
<div style="display: none;" id="the_div_1">
<div align="left">
<span class="help"><b>Employee regularly works Wednesday through Saturday and the holiday falls on a Monday</b></span><br>
<label>
<input type="radio" name="RadioGroup1" value="1a" >
<span class="normal">Option A</span>
<ul class="list">
<li>8 hours of holiday pay </li>
<li>40 hours of regular pay ( straight time )</li>
<li>Total: 48 Hours of pay</li>
</ul>
</label>
<br>
<label>
<input type="radio" name="RadioGroup1" value="1b">
<span class="normal">Option B</span>
<ul class="list">
<li>8 Hours of Holiday Pay</li>
<li>40 Hours of regular pay ( straight time )</li>
<li>8 Hours overtime pay ( time and a half )</li>
<li>Total: 60 Hours of pay</li>
</ul></label>
<br>
</div>
</div>
<div style="display: none;" id="the_div_2">
<div align="left">
<span class="help"><b>Employee regularly works Sunday through Wednesday and the holiday falls on a Monday</b></span><br>
<label>
<input type="radio" name="RadioGroup1" value="1c" >
<span class="normal">Option C</span>
<ul class="list">
<li>8 hours of holiday pay </li>
<li>32 hours of regular pay ( straight time )</li>
<li>Total: 40 Hours of pay</li>
</ul>
</label>
<br>
<label>
<input type="radio" name="RadioGroup1" value="1d">
<span class="normal">Option D</span>
<ul class="list">
<li>8 Hours of Holiday Pay</li>
<li>40 Hours of regular pay ( straight time )</li>
<li>Total: 48 Hours of pay</li>
</ul></label>
<br>
</div>
</div>
</p>
</div>
<!-- end Position -->
</div>
</div>
<input name="sendq" type="submit" class="button" value="Submit"></center> </p>
<input type="hidden" name="dateentered" value="3/17/2008 2:37:37 PM">
<input type="hidden" name="UserName" value="">
</form>
</body>
</html>
|
|
|
|