datagrid里列的div显示

现在一datagrid,其中一列system_id有连接
当鼠标移动到system_id列时，就会浮动显示相应内容，内容是一张view页面
不同的system_id对应不同的view页面
本来点击system_id就打开view页面的，因为客户说当鼠标移动到system_id也能显示的话，这样就方便多了。
现在请教前台和后台的编码该怎么写?我是用C#.NET

解决方案 »

  1.   

    在SYSTEMID的列加JS属性ONCLICK之类。然后一点就在当前页出来这样行了吧？这里有个例子，你看看合适不
    <%@ Import namespace="System.Data"%>
    <%@ Page language="c#" Codebehind="HierarchicalDataGrid.aspx.cs" AutoEventWireup="false" Inherits="testasp.HierarchicalDataGrid" %>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <title>显示主次关系数据的例子(点击可展开)</title>
    <meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.0">
    <meta name="CODE_LANGUAGE" content="Visual Basic 7.0">
    <meta name="vs_defaultClientScript" content="JavaScript">
    <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
    </HEAD>
    <script language="javascript">
    function showlist(showid)
    {
    if (showid.style.display=='none')
    {
    showid.style.display = '';
    }
    else
    {
    showid.style.display = 'none';
    }
    }
    </script>
    <body>
    <form id="FrmDataGrid" method="post" runat="server">
    <P align="center">
    <asp:DataGrid id="DataGrid1" BorderColor="#0099FF" runat="server" ShowHeader="False" Width="470px"
    CellPadding="0" CellSpacing="0" AutoGenerateColumns="False" BorderWidth="2px" AllowPaging="True">
    <Columns>
    <asp:TemplateColumn>
    <ItemTemplate>
    <TABLE cellSpacing="0" cellPadding="0" width="100%" border="0">
    <TR>
    <TD onclick="showlist(dd<%# DataBinder.Eval(Container.DataItem, "OrderID") %>);" bgColor="#FF6600"><B>订单号：
    <%# DataBinder.Eval(Container.DataItem, "OrderID") %>
    </B>
    </TD>
    </TR>
    <TR>
    <TD align="right" style="DISPLAY: none"   id="dd<%# DataBinder.Eval(Container.DataItem, "OrderID") %>">
    <asp:DataGrid id=DataGrid2 runat="server" AutoGenerateColumns="False" BorderColor="#33FF33" DataKeyField="OrderID" DataSource='<%# ((DataRowView)(Container.DataItem)).CreateChildView("OrderRelation") %>'>
    <HeaderStyle Font-Bold="True" ForeColor="#CC0066" BackColor="#FFCCFF" ></HeaderStyle>
    <Columns>
    <asp:BoundColumn Visible="False" DataField="OrderID" ReadOnly="True"></asp:BoundColumn>
    <asp:TemplateColumn HeaderText="产品名称">
    <HeaderStyle Width="300px"></HeaderStyle>
    <ItemTemplate>
    <%# DataBinder.Eval(Container.DataItem, "ProductName") %>
    </ItemTemplate>
    </asp:TemplateColumn>
    <asp:BoundColumn DataField="UnitPrice" HeaderText="单价"></asp:BoundColumn>
    <asp:BoundColumn DataField="Quantity" HeaderText="数量"></asp:BoundColumn>
    <asp:BoundColumn DataField="Discount" HeaderText="折扣"></asp:BoundColumn>
    </Columns>
    </asp:DataGrid>
    </TD>
    </TR>
    </TABLE>
    </ItemTemplate>
    </asp:TemplateColumn>
    </Columns>
    </asp:DataGrid></P>
    </form>
    </body>
    </HTML>
      

  2.   

    using System;
    using System.Collections;
    using System.ComponentModel;
    using System.Data;
    using System.Drawing;
    using System.Web;
    using System.Web.SessionState;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.HtmlControls;
    using System.Data.SqlClient;
    using System.Configuration;
    using System.Collections.Specialized;namespace testasp
    {
    /// <summary>
    /// HierarchicalDataGrid 的摘要说明。
    /// </summary>
    public class HierarchicalDataGrid : System.Web.UI.Page
    {
    protected System.Web.UI.WebControls.DataGrid DataGrid1;

    private void Page_Load(object sender, System.EventArgs e)
    {
    // 在此处放置用户代码以初始化页面
    if(!Page.IsPostBack)
    {
    BindGrid();
    }

    }
    private void BindGrid()
    {

    string BindStr="Select * from Orders; select OrderID ,Products.ProductName,[order Details].Unitprice,[order Details].Quantity,[order Details].discount from [order Details],Products where [Order Details].ProductId=Products.ProductID";
    SqlConnection conn =new SqlConnection("server=localhost;Initial Catalog=northwind;Data Source=;User Id=;Password=;");
    SqlDataAdapter OrderAdapter= new SqlDataAdapter(BindStr, conn); DataSet OrderDataSet = new DataSet();
    OrderAdapter.Fill(OrderDataSet);
    OrderDataSet.Tables[0].TableName = "Orders";
    OrderDataSet.Tables[1].TableName = "Order Details";

    DataColumn Parent =new DataColumn("Parent");
    DataColumn Child =new  DataColumn("Child");
    Parent=OrderDataSet.Tables["Orders"].Columns["OrderID"];
    Child=OrderDataSet.Tables["Order Details"].Columns["OrderID"];
    DataRelation OrderRelation =new DataRelation("OrderRelation", Parent, Child, false);
    OrderDataSet.Relations.Add(OrderRelation);
    conn.Close();

    DataGrid1.DataSource = OrderDataSet.Tables["Orders"].DefaultView;
    DataGrid1.DataBind();


    }
    private void DataGrid1_PageIndexChanged(object source,DataGridPageChangedEventArgs e)
    {
    this.DataGrid1.CurrentPageIndex=e.NewPageIndex;
    DataGrid1.EditItemIndex = -1;
    BindGrid();
    }
    private void DataGrid1_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e) 
    {
    e.Item.Cells[0].BackColor = System.Drawing.Color.Ivory;
    }
    #region Web 窗体设计器生成的代码
    override protected void OnInit(EventArgs e)
    {
    //
    // CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
    //
    InitializeComponent();
    base.OnInit(e);
    }

    /// <summary>
    /// 设计器支持所需的方法 - 不要使用代码编辑器修改
    /// 此方法的内容。
    /// </summary>
    private void InitializeComponent()
    {    
    this.Load += new System.EventHandler(this.Page_Load);
    this.DataGrid1.PageIndexChanged += new System.Web.UI.WebControls.DataGridPageChangedEventHandler(this.DataGrid1_PageIndexChanged);
    }
    #endregion
    }
    }
      

  3.   

    我不要点，我只要鼠标移到system_id上就显示出来，
    谢谢楼上的，可我在.CS里没有看到对应的代码
      

  4.   

    前台：
    <asp:datagrid id="grd_workflow" runat="server" AllowSorting="True" Width="100%" AutoGenerateColumns="False"
    BorderStyle="Ridge" BorderColor="#94C7D6" CellSpacing="1" BorderWidth="1px" BackColor="White" CellPadding="3"
    GridLines="None">
    <SelectedItemStyle Font-Bold="True" ForeColor="White" BackColor="#9471DE"></SelectedItemStyle>
    <ItemStyle HorizontalAlign="Center" ForeColor="Black" BackColor="WhiteSmoke"></ItemStyle>
    <HeaderStyle Font-Bold="True" HorizontalAlign="Center" ForeColor="#084173" VerticalAlign="Middle"
    BackColor="#E7EFF7"></HeaderStyle>
    <FooterStyle ForeColor="Black" BackColor="#C6C3C6"></FooterStyle>
    <Columns>
    <asp:TemplateColumn>
    <HeaderStyle Width="30px"></HeaderStyle>
    <HeaderTemplate>
    <asp:CheckBox id="selectall" runat="server"></asp:CheckBox>
    </HeaderTemplate>
    <ItemTemplate>
    <asp:CheckBox id="cchk_msg" runat="server"></asp:CheckBox>
    </ItemTemplate>
    </asp:TemplateColumn>
    <asp:BoundColumn DataField="item_name" HeaderText="项目名称">
    <ItemStyle Font-Underline="True" ForeColor="SteelBlue"></ItemStyle>
    </asp:BoundColumn>
    <asp:TemplateColumn HeaderText="上载" HeaderStyle-HorizontalAlign=Center>
    <HeaderStyle Width="30px"></HeaderStyle>
    <ItemTemplate>
        <asp:Label runat="server"  ToolTip=<%# DataBinder.Eval(Container, "DataItem.webpub_upload_info")%> ID="Label2" NAME="Label1"><%# DataBinder.Eval(Container, "DataItem.upload")%></asp:Label>
    </ItemTemplate>
    </asp:TemplateColumn>
    <asp:TemplateColumn HeaderText="审核" HeaderStyle-HorizontalAlign=Center>
    <HeaderStyle Width="30px"></HeaderStyle>
    <ItemTemplate>
        <asp:Label runat="server"  ToolTip=<%# DataBinder.Eval(Container, "DataItem.webpub_aduit_info")%> ID="Label3" NAME="Label2"><%# DataBinder.Eval(Container, "DataItem.audit")%></asp:Label>
    </ItemTemplate>
    </asp:TemplateColumn>
    <asp:TemplateColumn HeaderText="审批" HeaderStyle-HorizontalAlign=Center>
    <HeaderStyle Width="30px"></HeaderStyle>
    <ItemTemplate>
        <asp:Label runat="server"  ToolTip=<%# DataBinder.Eval(Container, "DataItem.webpub_approve_info")%> ID="Label4" NAME="Label3"><%# DataBinder.Eval(Container, "DataItem.approve")%></asp:Label>
    </ItemTemplate>
    </asp:TemplateColumn>
    <asp:TemplateColumn HeaderText="归档" HeaderStyle-HorizontalAlign=Center>
    <HeaderStyle Width="30px"></HeaderStyle>
    <ItemTemplate>
        <asp:Label runat="server"  ToolTip=<%# DataBinder.Eval(Container, "DataItem.webpub_store_info")%> ID="Label5" NAME="Label4"><%# DataBinder.Eval(Container, "DataItem.store")%></asp:Label>
    </ItemTemplate>
    </asp:TemplateColumn>
    <asp:BoundColumn DataField="webpub_status" HeaderText="项目状态"></asp:BoundColumn>
    <asp:TemplateColumn HeaderText="下载">
    <ItemTemplate>
    <asp:HyperLink id="btn_down" runat="server" NavigateUrl=<%# DataBinder.Eval(Container, "DataItem.item_location")%> onclick="alert('请用右键另存为...'); return false" ForeColor="SteelBlue" Font-Underline=True>下载</asp:HyperLink>
    </ItemTemplate>
    </asp:TemplateColumn>
    <asp:BoundColumn Visible="False" DataField="ctrflow_id"></asp:BoundColumn>
    <asp:BoundColumn Visible="False" DataField="item_location"></asp:BoundColumn>
    <asp:BoundColumn Visible="False" DataField="drawing_userid"></asp:BoundColumn>
    <asp:BoundColumn Visible="False" DataField="audit_userid"></asp:BoundColumn>
    <asp:BoundColumn Visible="False" DataField="approve_userid"></asp:BoundColumn>
    <asp:BoundColumn Visible="False" DataField="store_userid"></asp:BoundColumn>
    <asp:BoundColumn Visible="False" DataField="webpub_type"></asp:BoundColumn>
    <asp:BoundColumn Visible="False" DataField="isexistdwfdwg"></asp:BoundColumn>
    </Columns>
    <PagerStyle HorizontalAlign="Right" ForeColor="Black" BackColor="#C6C3C6"></PagerStyle>
    </asp:datagrid>
      

  5.   

    后台:
    grd_workflow.DataSource=WorkFlow_biz.ResultDS.Tables[1];
    grd_workflow.DataBind();
      

  6.   

    行里加js 属性 写js脚本事件,以前作过行随鼠标移动变色的应用