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变 ...

随机推荐

（转载）前端构建工具gulpjs的使用介绍及技巧
本文转载自:https://www.cnblogs.com/2050/p/4198792.html gulpjs是一个前端构建工具,与gruntjs相比,gulpjs无需写一大堆繁杂的配置参数,API ...
剑指offer——75不用加减乘除做加法
题目描述写一个函数,求两个整数之和,要求在函数体内不得使用+.-.*./四则运算符号. 题解: 使用位运算 class Solution { public: int Add(int num1 ...
Day 21 python ：面向对象类的相关内置函数 /单例模式 /描述符
1.isinstance(obj,cls) 检查obj是否是类cls的对象: 备注:用isinstance 的时候,产生实例后,会显示实例既是父类的实例,也是子类的实例 class Mom: gend ...
shell默认参数脚本
如果不加参数则默认执行restart函数,加stop,则执行stop函数 #!/bin/bash # version function stop(){ # stop the command } fun ...
leetcode.数组.16最接近的三数之和-java
1. 具体题目给定一个包括 n 个整数的数组 nums 和一个目标值 target.找出 nums 中的三个整数,使得它们的和与 target 最接近.返回这三个数的和.假定每组输入只存在唯一答案 ...
DNF邀请码开发再开发方案需求
一.原因分析: 1.现实原因:主播粉丝量级有限,一定规模粉丝注册消耗完后无法进行之后合作 2.主播资源有限,能合作主播数量少 3.直播粉丝真实接近核心用户,但是不能将其有效转化为平台流水 ...
8-MySQL-Ubuntu-数据表中数据的增加(一)
增(insert) (1)全部字段插入数据:按表中字段顺序增加数据注:(1)主键字段可以使用0/null/default来占位.(2)gender字段中数据类型是枚举,可以使用索引数字1,2,3,4 ...
SingalR 构建推送服务器初探
项目需要用到推送,于是重新研究了下推送框架,最好能够独立成一个服务,与业务无关的服务,可以给所有的项目通用.找了好久最终决定用SinglR 框架. Signal 是微软支持的一个运行在 Dot NET ...
RHEL5/6/7中常用命令及命令之间的差异
System basics Task RHEL5 RHEL6 RHEL7 View subscription information /etc/sysconfig/rhn/systemid /etc/ ...
AWS的lambda和S3之间如何连携
今天正好遇到了这个问题,就在官方文档里查询,然后根据他的说明整理了一下大致的流程,详细的请参考AWS国际版的官方文档,这里只是作者的一个简单的流程展示. Lambda和S3连接 1.在S3的同一区域当 ...

DataList做一个相册,并可以上传图片

DataList做一个相册,并可以上传图片的更多相关文章

随机推荐

热门专题