My combobox and asp:fileupload and imagepreview all are inside update panel , my combobox is doing postback after which my image disappears... please help. how to retain back image after postback ?
In http://www.aspforums.net/Threads/879790/Solved-Maintain-state-of-FileUpload-control-and-preserve-file-across-PostBack-in-ASPNet/
thread Mudassar told me that if i remove input:file and put asp:file then it will be possible ... here's all code:
using System;
using System.Drawing;
using System.IO;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class Default3 : Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (Session["FileUpload1"] != null) {
object check = Session["FileUpload1"].ToString();
}
if (IsPostBack)
{
if (Session["FileUpload1"] == null && FileUpload1.HasFile)
{
Session["FileUpload1"] = FileUpload1;
showPath.Value = FileUpload1.FileName;
}
else if (Session["FileUpload1"] != null && (!FileUpload1.HasFile))
{
FileUpload1 = (FileUpload)Session["FileUpload1"];
showPath.Value = FileUpload1.FileName;
}
else if (FileUpload1.HasFile)
{
Session["FileUpload1"] = FileUpload1;
showPath.Value = FileUpload1.FileName;
}
}
}
protected void Button1_Click(object sender, EventArgs e)
{
int width = 150;
int height = 100;
Session["WorkingImage"] = FileUpload1.FileName;
Stream fs = FileUpload1.PostedFile.InputStream;
var br = new BinaryReader(fs);
byte[] bytes = br.ReadBytes((Int32)fs.Length);
string base64String = Convert.ToBase64String(bytes, 0, bytes.Length);
bool FileOK = true;
if (FileUpload1.HasFile)
{
String FileExtension = Path.GetExtension(Session["WorkingImage"].ToString()).ToLower();
String[] allowedExtensions = { ".png", ".jpeg", ".jpg", ".gif" };
for (int i = 0; i < allowedExtensions.Length; i++)
{
if (FileExtension == allowedExtensions[i])
{
FileOK = true;
}
}
if (FileOK)
{
Stream stream = FileUpload1.PostedFile.InputStream;
var image = new Bitmap(stream);
var target = new Bitmap(width, height);
Graphics graphic = Graphics.FromImage(target);
graphic.DrawImage(image, 0, 0, width, height);
target.Save(Server.MapPath("~/images/myimage.jpg"));
Image1.ImageUrl = "data:image/png;base64," + base64String;
}
}
}
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
Session["FileUpload1"] = FileUpload1.PostedFile;
}
}
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(window).load(function () {
$('#RemvBtn').click(function () {
$(this).hide();
$('#Image1').removeAttr('src');
$('.imageBox').removeAttr('style');
$('#showPath').val('');
});
$('#uplBtn').click(function () {
$('#FileUpload1').click();
});
});
function ValidateAll() {
var fileInput = document.getElementById('<%= FileUpload1.ClientID %>');
var filePreview = document.getElementById('<%= Image1.ClientID %>');
var file = fileInput.files[0];
var imageType = /image.*/;
if (file.type.match(imageType)) {
var reader = new FileReader();
reader.onload = function (e) {
filePreview.src = reader.result;
}
reader.readAsDataURL(file);
$('#RemvBtn').show();
document.getElementById('showPath').value = document.getElementById('FileUpload1').value.split('\\').pop().split('/').pop();
}
else {
alert('Not an image file!');
$('#RemvBtn').hide();
$('#showPath').val('');
}
};
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Image ID="Image1" Width="150" Height="100" runat="server" />
<input type="text" id="showPath" runat="server" clientidmode="Static" />
<input type="button" value="SELECT IMAGE" id="uplBtn" />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="UPLOAD" />
<input type="button" value="REMOVE" style="display: none;" id="RemvBtn" />
<asp:FileUpload ID="FileUpload1" Style="display: none;" onchange="ValidateAll();" runat="server" />
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" Height="21px" Width="193px" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
<asp:ListItem>dd</asp:ListItem>
<asp:ListItem>aa</asp:ListItem>
<asp:ListItem>asd</asp:ListItem>
</asp:DropDownList>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="Button1" />
<asp:AsyncPostBackTrigger ControlID="DropDownList1" />
</Triggers>
</asp:UpdatePanel>
</form>
</body>
</html>
Please reply as soon as possible ... Thanks
