Log in

View Full Version : New text box addition w/ input of previous text box


jaw
04-23-2012, 08:08 PM
Hello, I'm looking for a solution for when the user starts typing in a text box and then an empty text box appears under it.

I have found solutions to add a new row when user hits a "add new row" button but I am wanting a cleaner appearance with no button in place -- and the new/empty text box automatically appears on input.

The new text box addition would happen whenever user enters text in a text box and there would always be an empty row after all fields are entered.

An example of what need is similar to http://bit.ly/mXDwu but with no ADD button in place and only text box additions (no buttons)

Can anyone help me here? Thanks!
vwphillips
04-24-2012, 08:23 AM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title></title>
<script type="text/javascript">
/*<![CDATA[*/

function Add(ip){
var frm=ip.form,nme=ip.name,nu=nme.replace(/\D/g,''),nme=nme.replace(/\d/g,''),nip;
if (nu&&isFinite(nu*1)&&!frm[nme+(nu*1+1)]){
nip=zxcAddField('INPUT','text',nme+(nu*1+1));
nip.size=ip.size;
ip.parentNode.appendChild(nip);
nip.onclick=function(){ Add(this); }
}
}

function zxcAddField(nn,type,nme){
var obj;
try {
obj=document.createElement('<'+nn+' name="'+(nme||'')+'" '+(type?'type="'+type+'" ':'')+' >');
}
catch(error){
obj=document.createElement(nn);
if (type){
obj.type=type;
}
obj.name=nme||'';
}
return obj;
}

/*]]>*/
</script></head>

<body>
<form>
<input name="tom1" size="10" onmouseup="Add(this);"/>
</form>


</body>

</html>
jaw
04-24-2012, 05:01 PM
Brillance, vwphillips! Thanks!