I have a grouping of radio buttons and a checkbox displayed on the page as shown below
<html>
<head>
<title>Languages</title>
<script type="text/javascript">
</script>
</head>
<body>
<span>What language do you speak?</span>
<form action="">
<div id="controlArea">
<input type="radio" name="lanRadio" value="radioRussian"><label for="radioRussian">Russian</label><br />
<input type="radio" name="lanRadio" value="radioEnglish"><label for="radioRussian">English</label><br />
<input type="radio" name="lanRadio" value="radioSpain"><label for="radioRussian">Spanish</label><br />
<input type="radio" name="lanRadio" value="radioFrench"><label for="radioRussian">French</label><br />
<input type="checkbox" name="checkIn" value="CheckMore"><label for="CheckMore">Select more than one</label><br />
</div>
</form>
</body>
The goal is to allow users to switch between selecting multiple options when the "Select more than one" checkbox is ticked. If unchecked, the selection should revert back to only being able to choose one option. Additionally, when converting from radio buttons to checkboxes, the selected radio button should automatically be checked in the converted format.