I'm trying to customize a form depending on which radio button is clicked. When the user clicks on a radio button, a function writes HTML for a form field into a <span> tag inside the form. But when I submit the form, the dynamically-generated form fields don't get submitted.
Here's the skeleton version:
<form name="myform">
<input type="radio" name="radio" onclick="makeDynamic()">
<span ID="dynamic"></span>
<input type="text" name="regularformfield">
<input type="submit">
</form>
<script (etc)>
function makeDynamic() {
document.getElementById("dynamic").innerHTML = "<input type=\"text\" name=\"dynamicformfield\">";
}
</script>
Is there some trick to making these work. My workaround is to have these dynamic fields write their values to predefined hidden fields in the form onblur (or onchange, onclick, etc.) but this seems clunky.
Here's the skeleton version:
<form name="myform">
<input type="radio" name="radio" onclick="makeDynamic()">
<span ID="dynamic"></span>
<input type="text" name="regularformfield">
<input type="submit">
</form>
<script (etc)>
function makeDynamic() {
document.getElementById("dynamic").innerHTML = "<input type=\"text\" name=\"dynamicformfield\">";
}
</script>
Is there some trick to making these work. My workaround is to have these dynamic fields write their values to predefined hidden fields in the form onblur (or onchange, onclick, etc.) but this seems clunky.