Home Html HTML file upload example

Related Tutorials


 
 

Share on Google+Share on Google+

HTML file upload example

Advertisement
Here is an example of File Upload in html. In this program we have displayed three "text field" and one "Browse file" option. We have also used Reset button and Save button. We have used Reset button that resets all fields to blank and we have used Save button that adds the data and display it on the screen.

HTML file upload example

Here is an example of File Upload in html. In this program we have displayed three "text field" and one "Browse file" option. We have also used Reset button and Save button. We have used Reset button that resets all fields to blank and we have used Save button that adds the data and display it on the screen. When we save the data and the file browsed, an alert is displayed by the "alert" method. The value property that contains a value typed by user sets or returns the value attribute of a text field and a value set by a script

In this example we have shown three "Text Field", Reset button and last one is Save button.

Example

Fileupload.html

<html>
<head>
<script>
function displayResult()
{
var x=document.getElementById("textname").value;
var y=document.getElementById("textaddress").value;
var z=document.getElementById("textfiles").value;
var a=document.getElementById("upfile").value;
alert(x);
alert(y);
alert(z);
alert(a);
}
</script>
</head>
<body>
<form>
<table width="30%" bgcolor="#00FFFF" align="center">

<tr>
<td colspan=4><center><font size=4><b>File Upload in HTML</b></font></center></td>
</tr>

<tr>
<td>Name:</td>
<td><input type=text name=textnames id="textname"></td>
</tr>
<tr>
<td>Address:</td>
<td><input type=text name=textaddress id="textaddress"></td>
</tr>
<tr>
<td>About the file:</td>
<td><input type=text name=textfiles id="textfiles"></td>
</tr>
<tr>
<td>File to upload:</td>
<td><input type=file name=upfile id="upfile"><br>
</td>
</tr>
<tr>
<td><input type="reset"></td>
<td><input type=button onclick="displayResult()" value="Save"/></td>
</tr>
</table>
</form>
</body>
</html>

OutPut:-

Download Source Code

Advertisement

If you enjoyed this post then why not add us on Google+? Add us to your Circles



Liked it!  Share this Tutorial


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: June 4, 2013

Related Tutorials

Discuss: HTML file upload example  

Post your Comment


Your Name (*) :
Your Email :
Subject (*):
Your Comment (*):
  Reload Image
 
 
Comments:0
DMCA.com