How To Dynamically Add An New Input Field On "keydown" Using Jquery?
I want to have a new input field dynamically generated whenever I type on the last input field in the form. This is my HTML codes
Solution 1:
Not sure but you might like something like this:
<!DOCTYPE htmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html; charset=utf-8" /><title>Untitled Document</title><scripttype="text/javascript"src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><scripttype="text/javascript">
$txt=newArray();
$(function(){
$('#go').on('click',function(){
console.log($('form').serialize());
})
$('body').on('keydown','.last',function(){
$('.last').removeClass('last');
$('#go','body').before('</br><input class="last" type="text" name="text'+(Number($(this).attr('name').match(/[0-9]+/g))+1)+'" value="'+(Number($(this).attr('name').match(/[0-9]+/g))+1)+'"></br>');
})
})
</script></head><body><form><inputclass="last"type="text"name='text1'value="no text"><inputid="go"name=""type="button" /></form></body></html>
EDITS: I added a <form>
for you, and some codes to see what data we are sending when the button is clicked. See the result is your browser console
. i.e: firebug or others shortcut key usually: (F12)
Test it here: http://jsfiddle.net/3jLbm9sp/1/
Post a Comment for "How To Dynamically Add An New Input Field On "keydown" Using Jquery?"