Dynamic cfinput error

Question

Trying to dynamically insert a <cfinput tag with
Javascript. But I'm getting the following message even though I'm
insert the tag inside of the <cfform tag. Code works fine with
<input. Any work arounds? Suggestions? Hacks? Thanks.
Error message:
Error Occurred While Processing Request
Context validation error for tag CFINPUT.
The tag must be nested inside a CFFORM tag.
Javascript:
function addEvent()
var ni = document.getElementById('myDiv');
var numi = document.getElementById('theValue');
var num = (document.getElementById("theValue").value -1)+ 2;
numi.value = num;
var divIdName = "my"+num+"Div";
var newdiv = document.createElement('div');
newdiv.setAttribute("id",divIdName);
newdiv.innerHTML = "Professor First Name:
 &nbsp<cfinput name='Professor_First_Name'
type='text' id='Professor_First_Name' size='28'
style='overflow:hidden'></cfinput>  
    Professor Last
Name:    <input
name='Professor_Last_Name' type='text' id='Professor_Last_Name'
size='28' style='overflow:hidden'></input>[<a
href=\"javascript:;\"
onclick=\"removeEvent(\'"+divIdName+"\')\">Remove</a>]";
ni.appendChild(newdiv);
HTML:
<cfform ...
<div id="myDiv"> </div>
</cfform>
Thanks again,
WINSTON

Answer 1

Use the <input...> version.
You do not want JavaScript to insert a <cfinput...>
tag. It is not
going to do anything. <cfinput...> tags are run on the
server and build
<input...> tags. These tags are then sent to the client
where the
JavaScript runs. If this javascript where to put a
<cfinput...> tag
into the html, the browser is not going to understand it and
will just
ignore it. And it is too late for the CF server to do
anything it has
completed and forgotten about the request by this time.
A mantra to remember CFML is SERVER side and JavaScript is
CLIENT side
and never will the two mix.