DataList做一个相册,并可以上传图片
1、前台代码
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DataListPhotos_Page.aspx.cs" Inherits="DataSourceDemo.DataListPhotos_Page" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Photos</title>
<style>
.ShowPage-font
{ font-size:12px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DataList ID="DataList1" runat="server" CellPadding="4" CellSpacing="2"
GridLines="Both" RepeatColumns="3" RepeatDirection="Horizontal">
<ItemTemplate>
<div>
<a href='<%#"Photos/"+Eval("Name") %>' target="_blank" /><%--能够点击图片查看--%>
<asp:Image ID="Image1" runat="server" width="160" Height="98" ImageUrl='<%#"Photos/"+Eval("Name") %>' />
</div>
</ItemTemplate>
</asp:DataList>
<div class="ShowPage-font" >
<asp:Label ID="lblPageCount" runat="server"></asp:Label>
第<asp:Label ID="lblCount" runat="server"></asp:Label>页
<asp:LinkButton ID="lbtnPreview" runat="server" Text="上一页" OnClick="lbtnPreview_Click" Font-Size="Small" ></asp:LinkButton>
<asp:LinkButton ID="lbtnNext" runat="server" Text="下一页" OnClick="lbtnNext_Click" Font-Size="Small" ></asp:LinkButton>
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="btnUploadFile" runat="server" Text="确定上传" Height="21px" onclick="btnUploadFile_Click" />
</div>
</div>
</form>
</body>
</html>
2、后台代码
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.IO; namespace DataSourceDemo
{
public partial class DataListPhotos_Page : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
lblCount.Text = "1";
BindPhotos(); }
}
private void BindPhotos()
{
string ImagePath = Server.MapPath("~/Photos/");//图片路径
DirectoryInfo ImageFile = new DirectoryInfo(ImagePath);
FileInfo[] FileArray = ImageFile.GetFiles("*.jpg"); //得到目录下的所有jpg图片
DataTable dtPhoto = new DataTable("Album");
DataColumn colSmall = new DataColumn("Name");
DataColumn colNormal = new DataColumn("Photo");
dtPhoto.Columns.Add(colSmall);
dtPhoto.Columns.Add(colNormal);
for (int i = 0; i < (FileArray.Length); i++)//将图片存入table中
{
DataRow Row = dtPhoto.NewRow();
Row["Name"] = FileArray[i].Name;
Row["Photo"] = "./Photos/" + FileArray[i].Name;
dtPhoto.Rows.Add(Row);
}
//分页
PagedDataSource Source = new PagedDataSource();
Source.AllowPaging = true;
Source.DataSource = dtPhoto.DefaultView;
Source.PageSize = 9;
int CurrentPage = Convert.ToInt32(lblCount.Text);
Source.CurrentPageIndex = CurrentPage - 1;
lbtnPreview.Enabled = true;
lbtnNext.Enabled = true;
if (CurrentPage == 1)
{
lbtnPreview.Enabled = false;
}
if (CurrentPage == Source.PageCount)
{
lbtnNext.Enabled = false;
}
lblPageCount.Text = "共" + Source.PageCount + "页/";
DataList1.DataSource = Source;
DataList1.DataBind();
} protected void lbtnNext_Click(object sender, EventArgs e)//下一页
{
lblCount.Text = Convert.ToString(Convert.ToInt32(lblCount.Text) + 1);
BindPhotos();
} protected void lbtnPreview_Click(object sender, EventArgs e)//上一页
{
lblCount.Text = Convert.ToString(Convert.ToInt32(lblCount.Text) - 1);
BindPhotos();
} protected void btnUploadFile_Click(object sender, EventArgs e)//图片上传
{
string FilePath = Server.MapPath("~/Photos/");
HttpFileCollection UploadFile = Request.Files;
if (FileUpload1.HasFile)//表示控件是否包含文件
{
for (int i = 0; i < UploadFile.Count; i++)
{
HttpPostedFile postFile = UploadFile[i];
try
{
if (postFile.ContentLength > 0)
{
string FileName = postFile.FileName;
string SingleName = FileName.Substring(FileName.LastIndexOf(@"\") + 1);
postFile.SaveAs(FilePath + SingleName);
}
}
catch (Exception ex)
{
Assistant.AlertMessage(ex.Message, this);//Assistant是自定义的类，用于弹出窗口信息
}
}
Response.Redirect("~/DataListPhotos_Page.aspx");
}
else
{
Assistant.AlertMessage("请输入要上传的文件", this);
}
} }
}
3、Assistant类
public class Assistant
{
public static void AlertMessage(string msg, Page page)
{
page.ClientScript.RegisterStartupScript(page.GetType(), "", "<script language='javascript'>alert('" + msg + "');</script>");
} }
4、效果预览
DataList做一个相册,并可以上传图片的更多相关文章
- 记 FineUI 官方论坛所遭受的一次真实网络攻击！做一个像 ice 有道德的黑客！
在开始正文之前,请帮忙为当前 排名前 10 唯一的 .Net 开源软件 FineUI 投一票: 投票地址: https://code.csdn.net/2013OSSurvey/gitop/code ...
- VUE2.0+VUE-Router做一个图片上传预览的组件
之前发了一篇关于自己看待前端组件化的文章,但是由于学习和实践的业务逻辑差异,所以自己练习的一些demo逻辑比较简单,打算用vue重构现在公司做的项目,所以在一些小的功能页面上使用vue来做的,现在写的 ...
- .Net MVC&&datatables.js&&bootstrap做一个界面的CRUD有多简单
我们在项目开发中,做得最多的可能就是CRUD,那么我们如何在ASP.NET MVC中来做CRUD呢?如果说只是单纯实现功能,那自然是再简单不过了,可是我们要考虑如何来做得比较好维护比较好扩展,如何做得 ...
- 简单的做一个图片上传预览（web前端）
转载:点击查看原文 在做web项目很多的时候图片都是避免不了的,所以操作图片就成了一个相对比较棘手的问题,其实也不是说很麻烦,只是说上传然后直接预览的过程很恶心,今天简单的做一个处理. 效果预览: & ...
- 做一个APP
前言 有点零乱,但是我想写下来慢慢整理,搭建一个好点的工程-模式MVC, 会包括一些第三方库,动画库,第三方库管理关联,自定义常用控件的管理和关联 1.预编译文件的创建 在build setting ...
- 用Django加PIL做一个证件照模板生成器网页
最近在整理自己的简历,发现简历上面的ID照有些太老了,所以就准备重新准备一些证件照,刚好最近在弄自己的博客网站,想着直接做一个网页工具出来,直接生成证件照模板,这样还可以省去PS的麻烦.而且照片涉及到 ...
- 结合 Vuex 和 Pinia 做一个适合自己的状态管理 nf-state
一开始学习了一下 Vuex,感觉比较冗余,就自己做了一个轻量级的状态管理. 后来又学习了 Pinia,于是参考 Pinia 改进了一下自己的状态管理. 结合 Vuex 和 Pinia, 保留需要的功能 ...
- 【技巧】使用weeman来做一个钓鱼网页
本文来自网友836834283 对玄魂工作室的投稿. 工具项目地址:https://github.com/Hypsurus/weeman/ 克隆地址:https://github.com/Hypsur ...
- 用struts2标签如何从数据库获取数据并在查询页面显示。最近做一个小项目，需要用到struts2标签从数据库查询数据，并且用迭代器iterator标签在查询页面显示，可是一开始，怎么也获取不到数据，想了许久，最后发现，是自己少定义了一个变量，也就是var变量。
最近做一个小项目,需要用到struts2标签从数据库查询数据,并且用迭代器iterator标签在查询页面显示,可是一开始,怎么也获取不到数据,想了许久,最后发现,是自己少定义了一个变量,也就是var变 ...
随机推荐
- URAL 1748 The Most Complex Number
题目链接:https://vjudge.net/problem/11177 题目大意: 求小于等于 n 的最大反素数. 分析: n <= 10^18,而前20个素数的乘积早超过10^18,因此可 ...
- babel/core 6.x升级到7.x要碰到的一些坑
刚学习react.js没多久,碰到各种坑.就比如这个问题,弄了我3个小时,终于解决了.其实就是一个小问题. 报错信息: Error: Cannot find module '@babel/core' ...
- Hexo使用攻略-添加分类及标签
创建"分类"选项 生成"分类"页并添加tpye属性 打开命令行,进入博客所在文件夹.执行命令 hexo new page categories 成功后会提示: ...
- 豆瓣图书Top250
从豆瓣图书Top250抓取数据,并通过词云图展示 导入库 from lxml import etree #解析库 import time #时间 import random #随机函数 import ...
- 1-Navicat无法远程连接Ubuntu上的MySQL（已解决）
转发自: https://jingyan.baidu.com/article/4d58d54156ff069dd4e9c085.html
- Ubuntu安装mongo可视化工具
一.robo 3T 是mongodb的一个非常好用的可视化管理工具,曾经名为robomongo,现在被收购后改名为robo 3T.且现在robo 3T 1.1版本能支持mongodb3.4.现在在Ub ...
- JS对象 编程练习 某班的成绩出来了，现在老师要把班级的成绩打印出来。 效果图: XXXX年XX月X日 星期X--班级总分为:81
编程练习 某班的成绩出来了,现在老师要把班级的成绩打印出来. 效果图: XXXX年XX月X日 星期X--班级总分为:81 格式要求: 1.显示打印的日期. 格式为类似"XXXX年XX月XX日 ...
- （PASS）什么是原子性和原子性操作？
什么是原子性操作呢? 下面我举一个例子来说明一下: A想要从自己的帐户中转1000块钱到B的帐户里.那么从A开始转帐,到转帐结束的这一个过程,称之为一个事务.在这个事务里,要做如下操作: 1. 从A的 ...
- Shell [[]]详解：检测某个条件是否成立
[[ ]]是 Shell 内置关键字,它和 test 命令类似,也用来检测某个条件是否成立. test 能做到的,[[ ]] 也能做到,而且 [[ ]] 做的更好:test 做不到的,[[ ]] 还能 ...
- thymeleaf种处理select，radio和文字回显的问题
select根据后台集合显示下列列表 <select class="form-control" name="parentId" > <opti ...