To preface, I am 100% sure this question has been asked before, but I have no idea how to word it properly to get the search results I need.
The objective is simple. I want a user to be able to input a location on my web page, that will automatically add a location 2 input underneath once you start typing into the first location input.
location: *type here*
\/\/\/\/\/\/\/\/
location: example...
location 2: *type here*
I want the input locations to keep appearing until whatever arbitrary set limit I encode.
Our web app is using HTML, CSS, Javascript, and Perl. So I know there's a few methods to attach this, but I'd like to know the standard/accepted web dev approached
Thanks!
Edit: I suppose I should add I wanted to do this with a html table in a form div.
You can add javascript simply. I am using native javascript but you can use anyother js library. First you have to add onkeyup event so that when user start typing myFunction() will be envoked.
<input type="text" id="location" name="location" onkeyup="myFunction()">
<input type="hidden" id="location_2" name="location_2">
Then you have to create myFunction(). In myFunction() you have to visible the hidden input field
<script>
function myFunction() {
document.getElementById("location_2").style.visibility = "visible";
}
</script>
You can also check the first location input is empty or not in the same way. If the first location input get empty you can also hide the second location.