Synchronizing two radio buttons (Progress 4GL, JS and HTML)

[steffichong]

I want to synchronize the HTML field, ind_title with gender, such that when I ticked Mr radio button, the Male will automatically be checked, and when I ticked Mrs or Ms, the Female will be checked. I tried this code, but it didn't seem to work. Help please? THANK YOU SO MUCH!

This is my HTML code.

<label class="control-label" for="linedesc">Title:</label>
<input type="radio" name="ind_title" value="1" `if ttAssuredMst.ind_title = STRING("1") then 'checked' else ''` onclick="checkGend()">Mr.
<input type="radio" name="ind_title" value="2" `if ttAssuredMst.ind_title = STRING("2") then 'checked' else ''` onclick="checkGend()">Mrs.
<input type="radio" name="ind_title" value="3" `if ttAssuredMst.ind_title = STRING("3") then 'checked' else ''` onclick="checkGend()">Ms.

<label class="control-label" for="linedesc">Gender:</label>
<input type="radio" name="gender" value="M" `if ttAssuredMst.gender = 'M' then 'checked' else ''` readonly>Male
<input type="radio" name="gender" value="F" `if ttAssuredMst.gender = 'F' then 'checked' else ''` readonly>Female


this is my JavaScript code.

<script type="text/javascript">
$(document).ready(function() {
$('.masktin').mask("999-999-999-999");
$("#client_since").mask("99/99/9999");
$("#client_since").datepicker();
if ($("#num_addaddress2").val()=="0") {
$("#btninsertaddress").click();
}


});

function checkGend() {
if (document.getElementById('mr').checked) {
document.getElementById('male').checked = true;
}
else if (document.getElementById('mrs').checked) {
document.getElementById('female').checked = true;
}
else {
document.getElementById('female').checked = true;
}
}
</script>

Continue reading...