Add Input Fields

Use this script to upload files. As a file is selected, another input field is automatically added.

We have tested the code in IE 8.0, Firefox3.5.2, Opera 10.0.0, Netscape 9.0.0.6, Flock2.51 and Safari Public Beta 4(528.16). This script worked well in all platforms with one (4) variation observed in Safari Public Beta 4(528.16). This is a normal variation in Safari. Grab the below link and see how this effect appears (Screen Capture) in Safari.
[ How Effect Appears In Safari ]

For your Information: Before we begin, we feel obligated to advise you that the above form is for all intensive purposes a "Stand Alone" script. In other words, it really does not do much of anything other than what you see. In order to make it function as designed, you need to incorporate it into a valid working form. If you do not have a good Solid Knowledge of HTML coding, javascripts, forms and reconfigurations, please "Do Not Attempt" this until you are Proficient in the aforementioned areas.

D epending on your knowledge of HTML and javascripts, this is an easy four (4) part copy and paste code that goes in both the <HEAD> and <BODY> sections of your document. It also makes use of an external.js file you need to save and upload into your directory and a CSS section.

If your document has a CSS section, (which is located in the <HEAD> section) then all you need to do is add that part of the code into CSS section. If your document does not have a CSS section all you need to add the is the opening and closing style tags into this section of code. If this is a little confusing, See below on where and howto:

<!------- <OPENING> CSS STYLE TAG

<!------- </CLOSING> CSS STYLE TAG

Note Of Importance: If you are not sure of howto make the external .js file and make use of it within your document, grab the below link and it is fully explained.
[ .js File Howto ]

For your Information: If you are not comfortable or prefer not to use the external.js file, you can use the traditional cut/copy and paste instead of the external .js file. If you need a little refresher on what is required to achieve this, grab the below link and it is fully explained.
[ Traditional Cut/Copy and Paste ]

whichever above method (external.js or Traditional Cut/Copy and Paste) of adding a section of code into the <HEAD> section you select to use, there are "No" reconfigurations to be made in this section.

If you opt for the external.js file, then you need to add a sniplet of code into the <HEAD> section to call the external addInputFields.js file. (See Below)

Once all the above steps are done, the only thing left is to insert the <BODY> section of code into a functional form.

We hope our tutorial was easy to follow and we covered everything in detail. If you would like to add this effect into your pages, grab the respective below link and you are there. If you have any problems with this or anything else, feel free to consult our [ FAQ ] and if you can't find the answer there, [ contact us ].
[ Get Code Here ] [ Rate This Page ] [ Scripts In Conflict ]