asp.net 使用FileUpload控制元件上傳並顯示圖片
在專案中經常會遇到上傳圖片,在點選儲存按鈕向資料庫提交資料之前,讓圖片顯示在Image控制元件中,方法如下:
<tr>
<td width="20%" align="right" class="tablesingletdlable">
<asp:Label ID="Label6" runat="server" Text="書圖"></asp:Label>
</td>
<td align="left" width="80%" class="tablesingletdinput" colspan="3">
<asp:Image ID="tbtmpPic" runat="server" CssClass="inputc" Height="200px" Width="170px" />
<asp:HiddenField ID="allFileSize" runat="server" Value="0" />
<div id="msg" runat="server" style="text-align: center">
<fieldset>
<legend>圖 片 選 擇 </legend>請選擇圖片:<asp:FileUpload ID="FileUpload1" runat="server" />
<a class="zInputBtn">
<asp:Button ID="btnConfirm" runat="server" Text="新增書籍圖片" CssClass="inputButton" OnClick="btnConfirm_Click" />
</a>
</fieldset>
</div>
</td>
</tr>
---------------------------------------------------
/// <summary>
/// 圖片選擇確定
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void btnConfirm_Click(object sender, EventArgs e)
{
if (FileUpload1.HasFile)
{
string guid = Guid.NewGuid().ToString();
string newFileName = folder + "\\" + guid + Path.GetExtension(FileUpload1.FileName);
url = Page.ResolveUrl("~") + "Admin/BookImages/" + guid + Path.GetExtension(FileUpload1.FileName);
int totalFileSize = Int32.Parse(allFileSize.Value);
int fileSize = FileUpload1.PostedFile.ContentLength;
//此處也可以限制單個檔案的大小
if (totalFileSize + fileSize > 1024 * 1024 * 100)
{
Page.ClientScript.RegisterClientScriptBlock(typeof(string), "", @"<script>alert('總上傳的檔案超過了大小設定 1024 * 1024 !')</script>");
return;
}
FileUpload1.SaveAs(newFileName);
ListItem item = new ListItem();
item.Text = FileUpload1.FileName;
item.Value = url + "|" + newFileName;
tbtmpPic.Style["display"] = "";
tbtmpPic.ImageUrl = url;
totalFileSize += fileSize;
allFileSize.Value = totalFileSize.ToString();
}
}
相關文章
- asp.net2.0 上傳圖片(FileUpload控制元件) 並生成縮圖ASP.NET控制元件
- Django實現圖片上傳並前端頁面顯示Django前端
- React圖片上傳元件react-fileupload的使用方法React元件
- asp.net上傳圖片並同時生成縮圖 (轉)ASP.NET
- django 實現圖片上傳和顯示操作Django
- React-Quill中的圖片上傳及顯示ReactUI
- asp.net 圖片批量上傳預覽,在Silverlight頁面中讀取並滾動顯示ASP.NET
- ASP.NET WebApi 圖片上傳ASP.NETWebAPI
- asp.net上傳圖片生成縮圖ASP.NET
- 讓ASP.NET的FileUpload控制元件支援瀏覽自動上傳功能ASP.NET控制元件
- 上傳封面圖片前臺不顯示 Picture檔案裡可以看到上傳的圖片
- opencv圖片上如何顯示兩個小圖片OpenCV
- 解決WordPress文章上傳圖片使用中文名不顯示的問題
- javauploadify上傳圖片並預覽Java
- ASP.NET Ueditor上傳圖片新增水印ASP.NET
- 使用jpeg圖片庫,顯示圖片並簡單實現LCD的觸屏功能
- 用ASP.NET上傳圖片並生成可帶版權資訊的縮圖 (轉)ASP.NET
- QLabel顯示圖片 ,並實現縮放
- 實現ASP.NET中FileUpload多檔案上傳ASP.NET
- Laravel 使用 FastDFS 上傳圖片LaravelAST
- 利用vue-cropper剪裁圖片並上傳Vue
- 安卓自定義View實現圖片上傳進度顯示(仿QQ)安卓View
- asp.net下使用 jquery.form.js 上傳圖片(檔案)ASP.NETjQueryORMJS
- Java實現圖片上傳到伺服器,並把上傳的圖片讀取出來Java伺服器
- element上傳圖片元件使用方法|圖片回顯|格式轉換base64元件
- img圖片無法顯示利用onerror事件顯示替代圖片Error事件
- 7.1、使用Commons Fileupload上傳檔案
- 請問帝國CMS圖片上傳後顯示亂碼怎麼辦
- 圖片裁剪並上傳到阿里雲oss阿里
- psd圖片不能在網頁上顯示網頁
- 使用 HTML5 Canvas 實現圓形圖片裁剪並上傳HTMLCanvas
- 鴻蒙跳轉到相簿或者檔案選擇圖片並顯示到Image控制元件中鴻蒙控制元件
- 瀏覽器更新HTTP伺服器圖片並顯示瀏覽器HTTP伺服器
- AXIOS從伺服器載入圖片並顯示iOS伺服器
- 第四章 載入並顯示PNG圖片
- Android圖片處理:識別影象方向並顯示Android
- Retrofit+RxJava上傳圖片上傳圖片到後臺RxJava
- 將上傳圖片打上防偽圖片水印並寫入資料庫資料庫