C# Tutorials and offshore development in India
    Tutorials   Resources   Forum   Communities   Interview   Jobs   Projects   Training   ASP.NET Web Hosting    
Silverlight Games | Mentor | Code Converter | Articles | Code Factory | Computer Jokes | Members | Peer Appraisal | IT Companies | Bookmarks | Polls | Revenue Sharing |


Prizes & Awards
My Profile



Active Members
TodayLast 7 Days more...

Play Silverlight Games or Submit your Silverlight applications and earn 90% AdSense revenue.

New Feature: Community Sites: Create your own .NET community website and start earning from Google AdSense ! It's Free !






Resources » Code Snippets » Javascript »

display image in image control from file upload control


Posted Date: 12 Nov 2008    Resource Type: Code Snippets    Category: Javascript
Author: Varun BansalMember Level: Gold    
Rating: Points: 4



When we have use fileupload it's not display the image at the same time when we select any image.

So we have use this javascript image show in image control when u will select any image file from file uploade control.

on .aspx page

<script language="javascript" type="text/javascript">
function LoadImage()
{ document.getElementById('img').src=document.getElementById('File1').value;
}
</script>


on .aspx.cs page

<form id="form1" runat="server">
<input id="File1" type="file" onchange="LoadImage()" />
<img id="img" src="" alt="Image" />
</form>





Responses

Author: T.S. Haritha     13 Nov 2008Member Level: Bronze   Points : 0
It is good. I tried it. it works perfectly.

But i tried to capture the file path of uploaded image in .aspx.cs file i am unable to do it. Can you please tell me how i can do it?


Author: Ilyas    19 Jan 2009Member Level: Silver   Points : 2
Hi,

You can get the Path of the file by create object for HtmlfileuploadCollection like this:


protected void btnSubmit_Click(object sender, EventArgs e)
{
HttpFileCollection uploads = HttpContext.Current.Request.Files;

for (int i = 0; i < uploads.Count; i++)
{
FileName += Path.GetFileName(uploads[i].FileName)+"
";
}
for (int i = 0; i < uploads.Count; i++)
{

if (uploads[i].ContentLength > 0)
{
string c=Path.GetFileName(uploads[i].FileName);
try
{

uploads[i].SaveAs("C:\\UploadedUserFiles\\" + c);
Span1.InnerHtml = "Upload(s) Successful.";

}
catch
{
Span1.InnerHtml = "Upload(s) FAILED.";

}
}


}Response.Write(FileName);
}


With Reagrds

Ilyas F


Author: Sasikumar    18 Feb 2009Member Level: Gold   Points : 1
Hello

U can use this.

FuImage --> File upload Control
ImgPhoto --> Image Control

If fuImage.HasFile Then
fuImage.PostedFile.SaveAs(Server.MapPath("UploadedImages/" & fuImage.FileName))
imgphoto.ImageUrl = "UploadedImages/" & fuImage.FileName

End


Author: Sathish    18 Feb 2009Member Level: Gold   Points : 2
Design page
===========















   
CssClass="validator" Display="Dynamic" ErrorMessage="Please Upload a .jpg file.">
ValidationExpression=".*(\.jpg|\.JPG|\.jpeg|\.JPEG)$" >

Text="Upload Image" Width="112px" OnClientClick="ChecksystemhasImage()" />



VB
===
Protected Sub btnUpload_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnUpload.Click
FuPicture.PostedFile.SaveAs(Server.MapPath("staffphoto/" & FuPicture.FileName))
Dim strscript As String
imgPhoto.ImageUrl = "staffphoto/" & FuPicture.FileName
End Sub


Feedbacks      
Popular Tags   What are tags ?   Search Tags  
Sign In to add tags.
Display image in image control by javascript  .  Display image from file upload control  .  

Post Feedback


This is a strictly moderated forum. Only approved messages will appear in the site. Please use 'Spell Check' in Google toolbar before you submit.
You must Sign In to post a response.
Next Resource: Example on JavaScript
Previous Resource: Formatting the Phone Numbers in Javascript
Return to Discussion Resource Index
Post New Resource
Category: Javascript


Post resources and earn money!
 
Related Resources



dotNet Slackers

About Us    Contact Us    Privacy Policy    Terms Of Use