DataList绑定照片并分页

     善良公社中需要上传图片，然而上一篇是通过自定义图片控件实现的，通过研究了Dalist发现它对于绑定图片十分方便，并且可以分页，这里来分享一下。

   在Web页面中的代码：

  

 <form id="Form1" runat="server">            <asp:DataList ID="dlPictrue" runat="server" RepeatColumns="5" RepeatDirection="Horizontal">                <ItemTemplate>                    <asp:Image ID="Image1" runat="server" Width="140px" ImageUrl='<%#DataBinder.Eval (Container.DataItem, "PhotoUrl","Photo/{0}") %>' Height="170px" />                    <p style="text-align: center">                        <asp:Label ID="lblName" runat="server" Text='<%#Eval("PhotoName") %>' Font-Size="12px"></asp:Label>                    </p>                </ItemTemplate>            </asp:DataList>            <br />            <p style="height: 23px; width: 700px; text-align: center; font-size: 16px;" background="images/相册_09.jpg">                当前页码为［<asp:Label ID="lblCurrentPage" runat="server" Text="1"></asp:Label>］页 总页码［<asp:Label                    ID="lblSumPage" runat="server" Text="0"></asp:Label>］页                        <asp:LinkButton ID="lnkBtnFirst" runat="server" Font-Underline="False" OnClick="lnkBtnFirst_Click"> 第一页 </asp:LinkButton>                <asp:LinkButton ID="lnkBtnPrevious" runat="server" Font-Underline="False" OnClick="lnkBtnPrevious_Click"> 上一页 </asp:LinkButton>                <asp:LinkButton ID="lnkBtnNext" runat="server" Font-Underline="False" OnClick="lnkBtnNext_Click"> 下一页 </asp:LinkButton>                <asp:LinkButton ID="lnkBtnLast" runat="server" Font-Underline="False" OnClick="lnkBtnLast_Click"> 末一页 </asp:LinkButton>                                     </p>        </form>

后台代码

    后台将对分页的前进页写事件，
   

        protected void Page_Load(object sender, EventArgs e)        {            DataListBind();        }

        ///// <summary>        ///// 绑定当前用户的照片        ///// </summary>        public void DataListBind()        {            //判断用户是否已经登录            //if (Session["UserID"] == null)            //{            //    Page.ClientScript.RegisterStartupScript(Page.GetType(), "message", "<script language='javascript' defer>alert('您尚未登录，请登录！');</script>");            //    return;            //}            DataTable dt = new DataTable();            dt.Columns.Add(new DataColumn("PhotoID", typeof(string)));            dt.Columns.Add(new DataColumn("PhotoName", typeof(string)));            dt.Columns.Add(new DataColumn("PhotoUrl", typeof(string)));            dt.PrimaryKey = new[] { dt.Columns["PhotoID"] };            //实例化一个B层对象            userPhotoBLL userphotobll = new userPhotoBLL();            //实例化一个实体的对象            userPhotoEntity enUserPhoto = new userPhotoEntity();            if (Session["ID"]==null)            {               Page.ClientScript.RegisterStartupScript(Page.GetType(), "message", "<script language='javascript' defer>alert('查看的用户不存在！');</script>");               return;            }            enUserPhoto.UserID = Session["ID"].ToString();//获取查看当前用户的ID            string strWhere = "UserID='" + enUserPhoto.UserID + "'";            //根据查询条件获得数据列表            DataSet ds = userphotobll.GetList(strWhere);            //根据是否有记录来进行显隐            if (ds.Tables[0].Rows.Count == 0)            {                NoImage.Visible = true;  //有数据则显示出来            }            else            {                NoImage.Visible = false;  //无数据则隐藏            }            //根据表中记录数循环加载图片信息            for (int i = 0; i < ds.Tables[0].Rows.Count; i++)            {                if (ds.Tables[0].Rows.Count > 0)                {                    DataRow dr = dt.NewRow();                    dr[0] = ds.Tables[0].Rows[i][1].ToString();                    dr[1] = ds.Tables[0].Rows[i][2].ToString();                    dr[2] = ds.Tables[0].Rows[i][5].ToString();                    dt.Rows.Add(dr);                }            }            PagedDataSource pds = new PagedDataSource();            pds.DataSource = dt.DefaultView; //将查询结果绑定到分页数据源上。            pds.AllowPaging = true; //允许分页            pds.PageSize = 12; //设置每页显示多少张图片            pds.CurrentPageIndex = Convert.ToInt32(lblCurrentPage.Text) - 1; //设置当前页            lnkBtnFirst.Enabled = true; //控件翻页控件都设置为可用            lnkBtnLast.Enabled = true;            lnkBtnNext.Enabled = true;            lnkBtnPrevious.Enabled = true;            if (lblCurrentPage.Text == "1") //如果当前显示第一页，“第一页”和“上一页”按钮不可用。            {                lnkBtnPrevious.Enabled = false;                lnkBtnFirst.Enabled = false;            }            if (lblCurrentPage.Text == pds.PageCount.ToString()) //如果显示最后一页，“末一页”和“下一页”按钮不可用。            {                lnkBtnNext.Enabled = false;                lnkBtnLast.Enabled = false;            }            lblSumPage.Text = pds.PageCount.ToString(); //实现总页数            //将分页结果绑定到DataList控件上            dlPictrue.DataSource = pds; //绑定数据源            dlPictrue.DataKeyField = "PhotoID";            dlPictrue.DataBind();        }        /// <summary>        /// 第一页        /// </summary>        /// <param name="sender"></param>        /// <param name="e"></param>        protected void lnkBtnFirst_Click(object sender, EventArgs e)        {            lblCurrentPage.Text = "1";            DataListBind();        }        /// <summary>        /// 前一页        /// </summary>        /// <param name="sender"></param>        /// <param name="e"></param>        protected void lnkBtnPrevious_Click(object sender, EventArgs e)        {            lblCurrentPage.Text = (Convert.ToInt32(lblCurrentPage.Text) - 1).ToString();            DataListBind();        }        /// <summary>        /// 下一页        /// </summary>        /// <param name="sender"></param>        /// <param name="e"></param>        protected void lnkBtnNext_Click(object sender, EventArgs e)        {            lblCurrentPage.Text = (Convert.ToInt32(lblCurrentPage.Text) + 1).ToString();            DataListBind();        }        /// <summary>        /// 最后一页        /// </summary>        /// <param name="sender"></param>        /// <param name="e"></param>        protected void lnkBtnLast_Click(object sender, EventArgs e)        {            lblCurrentPage.Text = lblSumPage.Text;            DataListBind();        }

  这样照片在页面加载的时候就出来。我觉得DataList很方便，如果不是JS中写出来不兼容IE8，也不会考虑后台的这种写法，不过用了这种绑定也的确简单，起码各个浏览器是没问题。等深入研究JS后，再做个版本出来。

  需要的朋友可以去下载一下看看