• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    asp.net中GridView数据鼠标移入显示提示信息

    问题提出:

    在asp.net开发中,如果有这样的一个需求,如果在列表控件,如GridView中的某列中显示的是一个计算公式得出的值,那么需求来了,鼠标移入该数字,显示该数字的计算公式和过程,如何做?

    解决方案分析:

    常规可以使用控件的title属性来显示提示信息,但是显示信息的样式不美观。接下来我们可以使用这样的一个解决方案,其显示效果如下图所示:

    详细实现步骤:
    1、下载弹出提示框相关js文件包,下载地址:http://download.csdn.net/detail/taomanman/9083213

    2、将下载的文件解压,讲整个popTips文件夹放到你的项目目录下去,比如放到js文件夹下。

    3、在你需要的页面中引入相关文件,最主要的是以下几个文件:

    link href="../Js/popTips/tip-yellow/tip-yellow.css" rel="stylesheet" /> 
    script src="../Js/jquery-1.7.2.min.js">/script> 
    script src="../Js/popTips/jquery.poshytip.min.js">/script> 

    4、页面中使用GridView的话,我们可以使用模板列,如下所示:

    asp:GridView ID="GridView1" OnRowDataBound="GridView1_RowDataBound" AllowPaging="True" 
         runat="server" AutoGenerateColumns="False" OnPageIndexChanging="GridView1_PageIndexChanging" 
         CellPadding="4" CssClass="grid1" EmptyDataText="无数显示" PageSize="10" 
         Width="99%" HeaderStyle-Wrap="True"> 
         HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" /> 
       Columns> 
         ... 
        asp:TemplateField HeaderText="折标煤br>(千克标准煤)" ItemStyle-Width="100px" HeaderStyle-VerticalAlign="Middle" HeaderStyle-HorizontalAlign="Center" ItemStyle-HorizontalAlign="Center"> 
          ItemTemplate> 
            span id="zbm" style="color:blue; cursor:pointer;" runat="server" title='%#showZBMGS(Eval("DIAN").ToString(),Eval("RELI").ToString(),Eval("YUANMEI").ToString(),Eval("TIANRQ").ToString(),Eval("QIYOU").ToString(),Eval("CHAIYOU").ToString(),Eval("ZSNY").ToString()) %>'>%# Eval("ZBM") %>/span> 
          /ItemTemplate> 
         /asp:TemplateField> 
         ... 
       /Columns> 
     /asp:GridView> 

    5、后台cs代码中增加一个方法

    #region 折标煤计算公式显示 2015-09-06 
      /// summary> 
      /// 获取折标煤的计算公式 
      /// /summary> 
      /// param name="dian">/param> 
      /// param name="reli">/param> 
      /// param name="yuanmei">/param> 
      /// param name="tianranqi">/param> 
      /// param name="qiyou">/param> 
      /// param name="chaiyou">/param> 
      /// param name="zsny">/param> 
      /// returns>/returns> 
      public string showZBMGS(string dian, string reli, string yuanmei, string tianranqi, string qiyou, string chaiyou, string zsny) 
      { 
       double zbm = ((double.Parse(dian) * 0.1229) + (double.Parse(reli) * 0.0341) + (double.Parse(yuanmei) * 0.7143) + (double.Parse(tianranqi) * 1.2143) + (double.Parse(qiyou) * 1.4714) + (double.Parse(chaiyou) * 1.4571) + (double.Parse(zsny) * 1)) * 10; 
       ZBMGS = "折标煤 = 电 * 0.1229 + 热力 * 0.0341 + 原煤 * 0.7143 + 天然气 * 1.2143 + 汽油 * 1.4714 + 柴油 * 1.4571 + 再生能源 * 1/br>="; 
       ZBMGS += dian + "* 0.1229+" + reli + " * 0.0341+" + yuanmei + " * 0.7143+" + tianranqi + "* 1.2143+" + qiyou + " * 1.4714+" + chaiyou + " * 1.4571+" + zsny + " * 1/br>="; 
       ZBMGS += Math.Round(zbm, 2); 
       return ZBMGS; 
      } 
    #endregion 

    6、接下来在页面加载时,应用此信息提示,如下代码所示:

    $(function () { 
      //为控件增加信息提示 2015-09-06 
      $cb = $('#%=this.GridView1.ClientID%>').find('span[id$="zbm"]'); 
      $($cb).poshytip(); 
    }); 

    以上就是本文的全部内容,希望对大家有所帮助。

    您可能感兴趣的文章:
    • ASP.NET GridView控件在列上格式化时间及DataFormatString使用
    • asp.net DataFormatString格式化GridView
    • ASP.NET数据绑定GridView控件使用技巧
    • ASP.NET数据绑定之GridView控件
    • 利用jQuery及AJAX技术定时更新GridView的某一列数据
    • DevExpress实现GridView当无数据行时提示消息
    • asp.net读取excel中的数据并绑定在gridview
    • 使用ajax局部刷新gridview进行数据绑定示例
    • c#利用Excel直接读取数据到DataGridView
    • js获取GridView中行数据的两种方法 分享
    • C#与SQL连接:GridView控件对数据库的操作
    • asp.net Gridview数据列中实现鼠标悬浮变色
    • Gridview利用DataFormatString属性设置数据格式的方法
    上一篇:ASP.NET MVC5网站开发概述(一)
    下一篇:一个简单MVC5 + EF6示例分享
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    asp.net中GridView数据鼠标移入显示提示信息 asp.net,中,GridView,数据,鼠标,