通过DIV显示GridView中每行的图片

1.前台代码:

<% ... @ Control Language="C#" AutoEventWireup="true" CodeFile="ImageControl.ascx.cs" Inherits="usercontrol_ImageControl"  %>
<% ... @ Register Src="FolderTree.ascx" TagName="FolderTree" TagPrefix="uc2"  %>
<% ... @ Register Src="DepartPageControl.ascx" TagName="DepartPageControl" TagPrefix="uc1"  %>

< script  type ="text/javascript" > ...
  //<![CDATA[
  function CheckAll(oCheckbox)
  ...{
   var GridView2 = document.getElementById("<%=GridView1.ClientID %>");
   for(i = 1;i < GridView2.rows.length; i++)
   ...{
    GridView2.rows[i].cells[0].getElementsByTagName("INPUT")[0].checked = oCheckbox.checked;
   }
  }
  
    function takePostion(ln,dn) 
    ...{ 
        var obj = document.getElementById(dn); 
        var tipDiv = obj; mouseX = event.x + document.body.scrollLeft; mouseY = event.y + document.documentElement.scrollTop;
        with (tipDiv.style)
        ...{ 
            display='block'; left=parseInt(mouseX)+"px"; top=(parseInt(mouseY)+20)+"px";
            position='absolute'; 
        } 
    } 
    function hidden(ln,dn) 
    ...{ 
        var obj = document.getElementById(dn);
        with(obj.style) 
        ...{ 
            display="none"; 
        } 
    }
  //]]>
</ script >

< base  target ="_self"   />
< center >
     &nbsp; < table  style ="width: 66%" >
         < tr >
             < td  style ="height: 60px; text-align: center" >
             </ td >
             < td  style ="height: 60px; text-align: center" >
                 < strong >< span  style ="font-size: 14pt" > &nbsp; 插入图片 </ span ></ strong ></ td >
         </ tr >
         < tr >
             < td  style ="height: 60px; text-align: center" >
             </ td >
             < td  style ="height: 60px; text-align: center" >
                 < asp:RadioButtonList  ID ="radbtnUpload"  runat ="server"  AutoPostBack ="True"  OnSelectedIndexChanged ="radbtnUpload_SelectedIndexChanged"
                    RepeatDirection ="Horizontal" >
                     < asp:ListItem  Selected ="True" > 从图片库中选图片 </ asp:ListItem >
                     < asp:ListItem > 上传新图片 </ asp:ListItem >
                 </ asp:RadioButtonList ></ td >
         </ tr >
         < tr >
             < td  rowspan ="1"  style ="vertical-align: top; text-align: left" >
                 < asp:TreeView  ID ="TreeView1"  runat ="server"  OnSelectedNodeChanged ="TreeView1_SelectedNodeChanged"
                                    ShowLines ="True"  Font-Size ="9pt"  ForeColor ="#000000" >
                     < SelectedNodeStyle  ForeColor ="Red"   />
                 </ asp:TreeView >
             </ td >
             < td  style ="text-align: center" >
                 < asp:Panel  ID ="Panel1"  runat ="server"  Width ="100%" >
                     < table  style ="width: 100%" >
                         < tr >
                             < td  colspan ="3"  style ="text-align: center" >
                                 < table  width ="100%" >
                                     < tr >
                                         < td  colspan ="3"  style ="height: 21px; text-align: left" >
                                             < asp:GridView  ID ="GridView1"  runat ="server"  DataKeyNames ="序号"  CssClass ="table"  AllowPaging ="True"
                                                OnRowDataBound ="GridView1_RowDataBound"  PageSize ="5"  AutoGenerateColumns ="False"
                                                Width ="100%" >
                                                 < Columns >
                                                     < asp:TemplateField >
                                                         < HeaderTemplate >
                                                             < input  id ="Checkbox2"  runat ="server"  onclick ="CheckAll(this)"  type ="checkbox"  visible ="false"   />
                                                         </ HeaderTemplate >
                                                         < ItemTemplate >
                                                             < asp:CheckBox  ID ="ItemCheckBox"  name ="R_Check"  runat ="server"  Visible ="False"   />
                                                             < asp:LinkButton  ID ="lnkSelect"  runat ="server"  CommandName ="Select"  OnCommand ="lnkSelect_Command" > 选择 </ asp:LinkButton >
                                                         </ ItemTemplate >
                                                     </ asp:TemplateField >
                                                     < asp:TemplateField  HeaderText ="图片" >
                                                         < EditItemTemplate >
                                                             < asp:TextBox  ID ="TextBox1"  runat ="server"  Text ='<%#  Eval("完整路径") % > '> </ asp:TextBox >
                                                         </ EditItemTemplate >
                                                         < ItemTemplate >
                                                             < asp:Image  ID ="Image1"  runat ="server"  Height ="40px"  ImageUrl ='<%#  Eval("完整路径") % > '
                                                                Width="35px" />
                                                         </ ItemTemplate >
                                                         < ItemStyle  HorizontalAlign ="Center"  Width ="45px"   />
                                                     </ asp:TemplateField >
                                                     < asp:BoundField  DataField ="路径"  HeaderText ="图片说明"   >
                                                     </ asp:BoundField >
                                                     < asp:BoundField  DataField ="序号"  HeaderText ="序号"   />
                                                     < asp:BoundField  DataField ="完整路径"  HeaderText ="完整路径"   />
                                                 </ Columns >
                                                 < PagerSettings  Visible ="False"   />
                                             </ asp:GridView >
                                         </ td >
                                     </ tr >
                                     < tr >
                                         < td  colspan ="3"  style ="height: 21px; text-align: right" >
                                             &nbsp;
                                             < asp:LinkButton  ID ="lnkbtnFrist"  runat ="server"  OnClick ="lnkbtnFrist_Click" > 首页 </ asp:LinkButton >
                                             < asp:LinkButton  ID ="lnkbtnPre"  runat ="server"  OnClick ="lnkbtnPre_Click" > 上一页 </ asp:LinkButton >
                                             < asp:Label  ID ="lblCurrentPage"  runat ="server" ></ asp:Label >
                                             < asp:LinkButton  ID ="lnkbtnNext"  runat ="server"  OnClick ="lnkbtnNext_Click" > 下一页 </ asp:LinkButton >
                                             < asp:LinkButton  ID ="lnkbtnLast"  runat ="server"  OnClick ="lnkbtnLast_Click" > 尾页 </ asp:LinkButton >
                                            跳转到第 < asp:DropDownList  ID ="ddlCurrentPage"  runat ="server"  AutoPostBack ="True"  OnSelectedIndexChanged ="ddlName_SelectedIndexChanged" >
                                             </ asp:DropDownList > 页 </ td >
                                     </ tr >
                                 </ table >
                                 < asp:Button  ID ="btnOutPut"  runat ="server"  Text =" 确 定 "  OnClick ="btnOutPut_Click"
                                    CssClass ="button_skin"  Visible ="False"   /></ td >
                         </ tr >
                     </ table >
                 </ asp:Panel >
                 < asp:Panel  ID ="Panel2"  runat ="server"  Visible ="False"  Width ="100%" >
                     < table  style ="width: 100%" >
                         < tr >
                             < td  colspan ="3"  style ="text-align: center" >
                                 < input  id ="File1"  type ="file"  runat ="server"  class ="button_skin"   />
                                 < asp:Button  ID ="btnUpImage"  runat ="server"  OnClick ="btnUpImage_Click"  Text =" 上 传 "
                                    CssClass ="button_skin"   /></ td >
                         </ tr >
                     </ table >
                 </ asp:Panel >
             </ td >
         </ tr >
     </ table >
</ center >
< script  src ="wz_tooltip.js"  type ="text/javascript" ></ script >
< div  id ='d'  style ='display:none;  padding:3px; border-color:#0066ff; border-style:dashed; border-width:1px;" align =left' >< img  id ="showmaximg"  src =''  alt ="图片"   /></ div >
<!-- <div id='d' style='display:none;OVERFLOW: auto; WIDTH: 260px; HEIGHT: 300px' align="left"><img id="showmaximg" src='' /></div> -->

 2.后台代码:

using  System;
using  System.Data;
using  System.Configuration;
using  System.Collections;
using  System.Web;
using  System.Web.Security;
using  System.Web.UI;
using  System.Web.UI.WebControls;
using  System.Web.UI.WebControls.WebParts;
using  System.Web.UI.HtmlControls;
using  System.IO;
using  Microsoft.SharePoint;
using  yesinda.yesindakms.sharepoint;
using  yesinda.yesindakms.sharepoint.List;

public   partial   class  usercontrol_ImageControl : System.Web.UI.UserControl
... {
    public string ReturnValue = String.Empty;
    private SPSite site;
    private SPWeb web;
    private SPList list;
    private SPListItemCollection items;

    private string FolderPath = "/dept/gsb/DocLib4";
    
    private string siteUrl = "/dept/gsb/";
    public string SiteUrl
    ...{
        get ...{ return this.siteUrl; }
        set ...{ siteUrl = value; }
    }

    private string listName = "图片";
    public string ListName
    ...{
        get ...{ return this.listName; }
        set ...{ listName = value; }
    }

    protected void Page_Load(object sender, EventArgs e)
    ...{
        if (!IsPostBack)
        ...{
            ViewState["path"] = FolderPath;
            //GetFolder();
            BindGrid();

            site = ListLib.findParamSite(siteUrl, Context);
            web = site.OpenWeb();
            list = web.Lists[listName];
            items = list.Items;
            SPFolder root = list.RootFolder;
            TreeNode rootNode = new TreeNode(listName, root.Url);
            TreeView1.Nodes.Add(rootNode);
            AddChild(root, rootNode);
        }
    }

    创建数据源#region  创建数据源
    /**//// <summary>
    /// 创建数据源
    /// </summary>
    /// <returns></returns>
    ICollection CreateDataSource(string folderpath)
    ...{
        DataTable dt = new DataTable("mytable");  //创建一个名为mytable的DataTable对象形
        DataColumn dc = new DataColumn();         //创建一个列对象
        dc.DataType = System.Type.GetType("System.Int32");  //指定该列的数据类型
        dc.AutoIncrement = true;              //该列为自动增涨列
        dc.AutoIncrementSeed = 1;          //初始值
        dc.AutoIncrementStep = 2;          //增量
        dc.Caption = "id";                     //设置列的标题
        dc.ColumnName = "序号";       //设置 列集合对象中的列的名称,datagrid中显示该列名.
        dt.Columns.Add(dc);              //将该列对象加入到表mytable的列集合中
        //普通列
        DataColumn dc1 = new DataColumn();
        dc1.DataType = System.Type.GetType("System.String");
        dc1.AllowDBNull = false;
        dc1.Caption = "path";
        dc1.ColumnName = "路径";
        dt.Columns.Add(dc1);

        DataColumn dc2 = new DataColumn();
        dc2.DataType = System.Type.GetType("System.String");
        dc2.AllowDBNull = false;
        dc2.Caption = "path";
        dc2.ColumnName = "完整路径";
        dc2.DefaultValue = 25;
        dt.Columns.Add(dc2);

        SPSite sps = yesinda.yesindakms.sharepoint.List.ListLib.findParamSite("/dept/gsb/", this.Context);
        sps.AllowUnsafeUpdates = true;
        SPWeb spw = sps.OpenWeb();
        spw.AllowUnsafeUpdates = true;
        SPList list = spw.Lists["图片"];
        SPFolder folder = list.RootFolder;

        SPFolder f = spw.GetFolder(folderpath);

        foreach (SPFile file in f.Files)
        ...{
            if (dt != null)
            ...{
                DataRow dr = dt.NewRow();
                dr[0] = file.Item.ID;
                dr[1] = file.Name;
                dr[2] = "http://" + sps.HostName + file.ServerRelativeUrl;
                dt.Rows.Add(dr);
            }
        }
        DataView dv = new DataView(dt);
        return dv;
    }

    #endregion

    绑定TreeView#region  绑定TreeView

    private void AddChild(SPFolder parentFolder, TreeNode parentNode)
    ...{
        if (parentFolder.SubFolders.Count == 0)
            return;
        foreach (SPFolder f in parentFolder.SubFolders)
        ...{
            if (f.Name != "Forms" && f.Name.IndexOf("_") != 0)
            ...{
                TreeNode child = new TreeNode(f.Name, f.ServerRelativeUrl);
                parentNode.ChildNodes.Add(child);
                AddChild(f, child);
            }
        }
    }

    protected void TreeView1_SelectedNodeChanged(object sender, EventArgs e)
    ...{
        ViewState["path"] = this.TreeView1.SelectedNode.Value;
        BindGrid();
    }

    #endregion


    public void BindGrid()
    ...{
        this.GridView1.DataKeyNames = new string[] ...{ "序号" };
        this.GridView1.DataSource = CreateDataSource(ViewState["path"].ToString());
        this.GridView1.DataBind();

        this.ddlCurrentPage.Items.Clear();
        for (int i = 1; i <= this.GridView1.PageCount; i++)
        ...{
            this.ddlCurrentPage.Items.Add(i.ToString());
        }
        if (this.GridView1.PageIndex != 0)
        ...{
            this.ddlCurrentPage.SelectedIndex = this.GridView1.PageIndex;
        }
    }

    protected void btnUpImage_Click(object sender, EventArgs e)
    ...{
        AddImage();
    }

    上传图片#region  上传图片
    //保存图片路径
    public static string ImageUrl = String.Empty;

    /**//// <summary>
    /// 上传图片到图片库
    /// </summary>
    public void AddImage()
    ...{
        if (File1.Value != "")
        ...{
            //上传附件添加到文档库，并返回ID，赋给model.Mattachment
            string filename = File1.PostedFile.FileName.Substring(File1.PostedFile.FileName.LastIndexOf("/") + 1);
            Stream filedataStream = File1.PostedFile.InputStream;
            int dataLen = File1.PostedFile.ContentLength;
            string fileType = File1.PostedFile.ContentType;
            byte[] fileData = new byte[dataLen];
            filedataStream.Read(fileData, 0, dataLen);

            SPSite sps = yesinda.yesindakms.sharepoint.List.ListLib.findParamSite("/dept/gsb/", this.Context);

            sps.AllowUnsafeUpdates = true;
            SPWeb spw = sps.OpenWeb();
            spw.AllowUnsafeUpdates = true;
            SPList list = spw.Lists["图片"];
            SPFolder folder = list.RootFolder;
            SPFolderCollection folder2 = list.RootFolder.SubFolders;

            foreach (SPFolder folder3 in list.RootFolder.SubFolders)
            ...{
                if (folder3.Name == "所有图片")
                ...{
                    bool ex = false;
                    if (folder.Exists)
                    ...{
                        try
                        ...{
                            ex = folder3.Files[filename].Exists;
                            Response.Write("<script language="javascript">alert('已有相同名称的文件存在');</script>");
                            return;
                        }
                        catch
                        ...{
                            folder3.Files.Add(filename, fileData, true);
                            ImageUrl = "http://" + sps.HostName + folder3.ServerRelativeUrl + "/" + filename;
                        }
                    }
                }
            }

            Response.Write("<script>window.returnValue='" + ImageUrl + "';window.close();</script>");
        }
    }
    #endregion

    //全选
    protected void CheckAll(object sender, EventArgs e)
    ...{
        CheckBox cbx = (CheckBox)sender;
        foreach (GridViewRow gvr in GridView1.Rows)
        ...{
            CheckBox ch = (CheckBox)gvr.FindControl("ItemCheckBox");
            ch.Checked = cbx.Checked;
        }
    }

    /**//// <summary>
    /// 将图片库中的图片插入到文本中
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    protected void btnOutPut_Click(object sender, EventArgs e)
    ...{
        SPSite sps = yesinda.yesindakms.sharepoint.List.ListLib.findParamSite("/dept/gsb/", this.Context);

        sps.AllowUnsafeUpdates = true;
        SPWeb spw = sps.OpenWeb();
        spw.AllowUnsafeUpdates = true;
        SPList list = spw.Lists["图片"];

        string ReturnString = String.Empty;
        foreach (GridViewRow gvr in this.GridView1.Rows)
        ...{
            CheckBox ch = (CheckBox)gvr.FindControl("ItemCheckBox");
            if (ch.Checked)
            ...{
                SPListItem listcon = list.Items.GetItemById(Convert.ToInt32(GridView1.DataKeys[gvr.RowIndex].Value.ToString()));
                ReturnString += sps.Url + "/" + listcon.Url;
            }
        }
        Response.Write("<script>window.returnValue='" + ReturnString + "';window.close();</script>");
    }
    protected void radbtnUpload_SelectedIndexChanged(object sender, EventArgs e)
    ...{
        if (this.radbtnUpload.SelectedIndex == 0)
        ...{
            this.Panel1.Visible = true;
            this.Panel2.Visible = false;
        }
        else
        ...{
            this.Panel1.Visible = false;
            this.Panel2.Visible = true;
        }
    }
    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    ...{
        e.Row.Cells[4].Attributes.Add("style", "display:none");
        e.Row.Cells[3].Attributes.Add("style", "display:none");
        //滑过GridView控件显示不同颜色
        if (e.Row.RowType == DataControlRowType.DataRow)
        ...{
               //<a href="http://www.baidu.com" οnmοuseοver="this.T_SHADOWWIDTH=4;this.T_TEMP=3000;this.T_STICKY=1;this.T_OFFSETX=-20;return escape('图片提示 <img src='test.jpg' width='60'> ')"> 显示图片提示</a> 

            //e.Row.Attributes.Add("onmouseover", "this.T_SHADOWWIDTH=4;this.T_TEMP=3000;this.T_STICKY=1;this.T_OFFSETX=-20;return escape('图片提示 <img src='test.jpg' width='60'> ')");
            //e.Row.Attributes.Add("onmouseover", "this.T_SHADOWWIDTH=4;this.T_TEMP=3000;this.T_STICKY=1;this.T_OFFSETX=-20;return escape('图片提示 <img src='test.jpg' width='60'> ')");
            e.Row.Attributes.Add("onmouseover", "takePostion(this,'d');c=this.style.backgroundColor;this.style.backgroundColor='#f0ffff';javascript:document.getElementById('showmaximg').src='" + e.Row.Cells[4].Text + "'");
            e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=c;hidden(this,'d');");
        }

        this.lblCurrentPage.Text = string.Format("当前第{0}页/总共{1}页", this.GridView1.PageIndex + 1, this.GridView1.PageCount);
    }
    protected void lnkbtnFrist_Click(object sender, EventArgs e)
    ...{
        //显示首页
        this.GridView1.PageIndex = 0;
        BindGrid();
    }
    protected void lnkbtnPre_Click(object sender, EventArgs e)
    ...{
        //显示上一页
        if (this.GridView1.PageIndex > 0)
        ...{
            this.GridView1.PageIndex = this.GridView1.PageIndex - 1;
            BindGrid();
        }
    }
    protected void lnkbtnNext_Click(object sender, EventArgs e)
    ...{
        //显示下一页
        if (this.GridView1.PageIndex < this.GridView1.PageCount)
        ...{
            this.GridView1.PageIndex = this.GridView1.PageIndex + 1;
            BindGrid();
        }
    }
    protected void lnkbtnLast_Click(object sender, EventArgs e)
    ...{
        //显示最后一页
        this.GridView1.PageIndex = this.GridView1.PageCount;
        BindGrid();
    }
    protected void ddlName_SelectedIndexChanged(object sender, EventArgs e)
    ...{
        //选择指定页显示
        this.GridView1.PageIndex = this.ddlCurrentPage.SelectedIndex;
        BindGrid();
    }
    protected void lnkSelect_Command(object sender, CommandEventArgs e)
    ...{
        LinkButton lb = (LinkButton)sender;
        DataControlFieldCell dcf = (DataControlFieldCell)lb.Parent;
        GridViewRow gvr = (GridViewRow)dcf.Parent;
        GridView1.SelectedIndex = gvr.RowIndex;

        Response.Write("<script>window.returnValue='" + gvr.Cells[3].Text + "';window.close();</script>");
    }
}