Introduction: In previous articles i explained jQuery to validate file extension and upload image file and Bind,upload,download,delete image files from the GridView and Upload file and create Zip file and Check and validate file extension before uploading a file through FileUpload control and FileUpload Control in Update Panel using asp.net.
In this article i am going to explain with example How to keep/maintain image in the file upload control on occurring of post back event in asp.net using both the C# and VB.Net language.
Description: One of the common annoying problem that developer face while creating Asp.net application is to maintain the image on PostBack i.e. When we browse and select an image in FileUpload control and PostBack occurs before final submission then FileUpload control looses its value and we have to again select the image.
Implementation: Let's create an example to understand better.
<fieldset style="width:350px">
In this article i am going to explain with example How to keep/maintain image in the file upload control on occurring of post back event in asp.net using both the C# and VB.Net language.
Description: One of the common annoying problem that developer face while creating Asp.net application is to maintain the image on PostBack i.e. When we browse and select an image in FileUpload control and PostBack occurs before final submission then FileUpload control looses its value and we have to again select the image.
There is no other way I found
on the internet to maintain the state of the FileUpload control or Keep/Retain
the selected image in FileUpload control. But I found an alternative way to
handle this situation. As we know Session can store any object so we can store
the FileUpload control in the session object and in PostBack we can get the
value back from it.
Implementation: Let's create an example to understand better.
- In the <BODY> tag of the design page (.aspx) Place a FileUpload Control, a Label control and a CheckBoxList Control as shown :
<fieldset style="width:350px">
<legend>Retain
Image name in FileUpload control on PostBack</legend>
<asp:FileUpload ID="FileUpload1" runat="server" /><asp:Label ID="lblImageName" runat="server" ForeColor="#FF3300"></asp:Label>
<asp:CheckBoxList ID="CheckBoxList1" runat="server" AutoPostBack="true" RepeatColumns="3">
<asp:ListItem>Asp.net</asp:ListItem>
<asp:ListItem>Sql
Server</asp:ListItem>
<asp:ListItem>Javascript</asp:ListItem>
<asp:ListItem>JQuery</asp:ListItem>
<asp:ListItem>LINQ</asp:ListItem>
<asp:ListItem>WCF</asp:ListItem>
</asp:CheckBoxList>
</fieldset>
Note: AutoPostBack property of CheckBoxList control is set to true to cause
Postback.
C#.NET
Code to maintain/retain image on PostBack in FileUpload control in asp.net
- In the code behind file(.aspx.cs) write the code on page load event as:
{
//Case: 1 When the page is submitted
for the first time(First PostBack) and there is file
// in FileUpload control but session
is Null then Store the values to Session Object as:
if (Session["FileUpload1"]
== null
&& FileUpload1.HasFile)
{
Session["FileUpload1"] =
FileUpload1;
lblImageName.Text =
FileUpload1.FileName;
}
// Case 2: On Next PostBack Session
has value but FileUpload control is
// Blank due to PostBack then return the values from
session to FileUpload as:
else if (Session["FileUpload1"]
!= null
&& (!FileUpload1.HasFile))
{
FileUpload1 = (FileUpload)Session["FileUpload1"];
lblImageName.Text =
FileUpload1.FileName;
}
// Case 3: When there is value in
Session but user want to change the file then
// In this case we need to change
the file in session object also as:
else if (FileUpload1.HasFile)
{
Session["FileUpload1"] =
FileUpload1;
lblImageName.Text =
FileUpload1.FileName;
}
}
VB.NET
Code to maintain/retain image on PostBack in FileUpload control in asp.net
- In the code behind file(.aspx.vb) write the code on page load event as:
'Case: 1 When the page is submitted for the first
time(First PostBack) and there is file
' in FileUpload
control but session is Null then Store the values to Session Object as:
If Session("FileUpload1") Is Nothing AndAlso FileUpload1.HasFile Then
Session("FileUpload1") =
FileUpload1
lblImageName.Text =
FileUpload1.FileName
' Case 2: On Next PostBack Session
has value but FileUpload control is
' Blank due to PostBack then return
the values from session to FileUpload as:
ElseIf Session("FileUpload1") IsNot Nothing AndAlso (Not FileUpload1.HasFile) Then
FileUpload1 = DirectCast(Session("FileUpload1"), FileUpload)
lblImageName.Text = FileUpload1.FileName
' Case 3: When there is value in
Session but user want to change the file then
' In this case we need to change the
file in session object also as:
ElseIf FileUpload1.HasFile Then
Session("FileUpload1") =
FileUpload1
lblImageName.Text =
FileUpload1.FileName
End If
End Sub
Now over to you:
"If you like my work; you can appreciate by leaving your comments,
hitting Facebook like button, following on Google+, Twitter, Linked in and
Pinterest, stumbling my posts on stumble upon and subscribing for receiving
free updates directly to your inbox . Stay tuned and stay connected for more
technical updates."
7 comments
Click here for commentsNot working on server
ReplyHi rohan, what problem you are facing on server?
Replyhi, i am craeating file upload control in run time(dynamic).
ReplyWhen i clicked upload button,then fileupload.hasfile value is false.My uploaded file not displaying.
Please help me regarding this problem.
how to show image and text randomly from database
ReplyThanks :)
ReplyYour welcome..:)
ReplyHi, How do I retain image in picture box also? Thanks.
ReplyIf you have any question about any post, Feel free to ask.You can simply drop a comment below post or contact via Contact Us form. Your feedback and suggestions will be highly appreciated. Also try to leave comments from your account not from the anonymous account so that i can respond to you easily..