.ASPX
<head runat="server">
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
function showimagepreview(input) {
if (input.files && input.files[0]) {
var filerdr = new FileReader();
filerdr.onload = function (e) {
$('#ImageButton1').attr('src', e.target.result);
}
filerdr.readAsDataURL(input.files[0]);
}
}
</script>
<script language="javascript" type="text/javascript">
function clk() {
document.getElementById("FileUpload1").click();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div style="display: none">
<asp:FileUpload ID="FileUpload1" runat="server" onchange="showimagepreview(this)"/>
</div>
<asp:ImageButton ID="ImageButton1" runat="server" OnClientClick="clk(); return false;"
ImageUrl="~/img/b1.png" Width="40px" Height="40px"></asp:ImageButton>
<asp:Button ID="btnupload" runat="server" OnClick="btnupload_Click" Text="Upload" />
</div>
</form>
</body>
calling from code behind
protected void Page_Load(object sender, EventArgs e)
{
ImageButton1.Attributes.Add("onclick", string.Format("jQuery('#" + FileUpload1.ClientID + "').click();return true;",ClientScript.GetPostBackEventReference(ImageButton1, null)));
reference :- aspdotnet-suresh
<head runat="server">
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
function showimagepreview(input) {
if (input.files && input.files[0]) {
var filerdr = new FileReader();
filerdr.onload = function (e) {
$('#ImageButton1').attr('src', e.target.result);
}
filerdr.readAsDataURL(input.files[0]);
}
}
</script>
<script language="javascript" type="text/javascript">
function clk() {
document.getElementById("FileUpload1").click();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div style="display: none">
<asp:FileUpload ID="FileUpload1" runat="server" onchange="showimagepreview(this)"/>
</div>
<asp:ImageButton ID="ImageButton1" runat="server" OnClientClick="clk(); return false;"
ImageUrl="~/img/b1.png" Width="40px" Height="40px"></asp:ImageButton>
<asp:Button ID="btnupload" runat="server" OnClick="btnupload_Click" Text="Upload" />
</div>
</form>
</body>
calling from code behind
protected void Page_Load(object sender, EventArgs e)
{
ImageButton1.Attributes.Add("onclick", string.Format("jQuery('#" + FileUpload1.ClientID + "').click();return true;",ClientScript.GetPostBackEventReference(ImageButton1, null)));
reference :- aspdotnet-suresh
