How to add an infinite amount of text boxes

Question

I want to let a user add multiple email addresses (for example). I have a form with 1 text box to enter their first email address. Is there a way to add an "add another email address" button which lets them add an infinite amount of email addresses?

It is not possible to add an infinite number of text boxes. Eventually the browser will run out of RAM to store the text boxes in, and start having to use the pagefile, which will itself eventually overflow and crash the computer. — Niet the Dark Absol, Mar 08 '14 at 17:02
I think the word you're looking for is "indefinite" or "arbitrary". There is no way to add an infinite number of textboxes to anything. — JLRishe, Mar 08 '14 at 17:03
Do you know how to [`create`](https://developer.mozilla.org/en-US/docs/Web/API/document.createElement) an HTML [`button`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button) element, an HTML [`input`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input) element, and how to add a [`click`](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers.onclick) event to a button? — Xotic750, Mar 08 '14 at 17:07

score 4 · Accepted Answer · answered Mar 08 '14 at 17:15

Yes, of course. For instance:

Html:

<form name="myform">
    <ul id="addrlist">
        <li><input type="email" name="email" /></li>
    </ul>
    <button id="addaddr">Add an address</button>
</form>

JavaScript:

document.getElementById("addaddr").onclick = function() {
    var li = document.createElement("li");
    var input = document.createElement("input");
    input.setAttribute("type", "email");
    input.setAttribute("name", "email");
    li.appendChild(input);
    document.getElementById("addrlist").appendChild(li);
    return false;
};

http://jsfiddle.net/robbyn/P3LTU/

How to add an infinite amount of text boxes

1 Answers1