hide DIV when radio button is clicked with Javascript -
i want hide div when radio button clicked, cannot figure out life of me.. here code:
<li> residential <input type="radio" name="fee" id="residential" class="app_fee" value="<?php echo "$applicationfee_residential" ?>" onchange="mech_application.fee1.value = eval(mech_application.residential.value)" <?php if (isset($_post['fee'])) { print($residentialyes ? "checked" : ""); } ?> /> </li> <li> apartment/commercial <input type="radio" name="fee" id="apartment" class="app_fee" value="<?php echo "$applicationfee_apartment" ?>" onchange="mech_application.fee1.value = eval(mech_application.apartment.value)" <?php if (isset($_post['fee'])) { print($apartmentno ? "checked" : ""); } ?> /> </li> <li> revision <input type="radio" name="fee" id="revision" class="app_fee" value="<?php echo "$revision" ?>" onchange="mech_application.fee1.value = eval(mech_application.revision.value)" <?php if (isset($_post['revision'])) { print($revisionyes ? "checked" : ""); } ?> /> <?php if ($_server['request_method'] == 'post') { if (!isset($_post['fee'])) { $problem = true; print '<p class="error">please select application type</p>'; $error = true; } }?> </li> and want hide div when either residential or apartment or clicked, , show when revision clicked:
<div class="revision_hidden"> application id: <input type="text" name="revision_application_id" size="12" maxlength="40" value="<?php if (isset($_post['revision_application_id'])) { print htmlspecialchars($_post['revision_application_id']); } ?>" placeholder="application id"/> </div> any , appreciated! thank you!
give div id:
<div class="revision_hidden" id="my_div"> ... add onclick function radiobuttons:
<input type="radio" name="fee" id="residential" onclick="my_function(this)" ... <input type="radio" name="fee" id="apartment" onclick="my_function(this)" ... <input type="radio" name="fee" id="revision" onclick="my_function(this)" ... and add javascript function:
function my_function(elm) { if(elm == document.getelementbyid('residential') || elm == document.getelementbyid('apartment')) { //document.getelementbyid('my_div').style.visibility = "hidden"; document.getelementbyid('my_div').style.display = "none"; } else if(elm == document.getelementbyid('revision')) { //document.getelementbyid('my_div').style.visibility = "visible"; document.getelementbyid('my_div').style.display = "block"; } }
Comments
Post a Comment