拼接table 展示在前台

时间:2021-06-11 13:27:30

最近用惯了 gridview 等 数据展示控件 , 突然要求前台用table显示,且 table中的值是动态的 瞬间蒙了 ,后来想一想 用个简单的方法实现了功能 代码如下:


前台首先要有一个div     <div id="changs" runat="server"></div>


后台代码:

           DataTable dtDataList = GetDataList(value, s_tDate, s_Type, "0"); // 获取数据集
            if (dtDataList != null && dtDataList.Rows.Count > 0)
            {
                StringBuilder ss = new StringBuilder();
                ss.Clear();
                ss.Append(" <table style=\"width: 93%;  border-top:2px solid #33CC00; border-bottom:2px solid #33CC00;\"> ");
                    for (int i = 0; i < dtDataList.Rows.Count; i++)
                    {
                        d_ElecName = dtDataList.Rows[i]["F_EnergyItemName"].ToString();  //能耗名称
                        if (d_Area == Convert.ToDouble(0))
                        {
                            d_DWValue = "0.00";
                        }
                        else
                        {
                            d_DWValue = (Convert.ToDouble(dtDataList.Rows[i]["Value"]) / d_Area).ToString("0.00");//单位面积值
                        }
                        if (d_Num == Convert.ToDouble(0))
                        {
                            d_RJValue = "0.00";
                        }
                        else
                        {
                            d_RJValue = (Convert.ToDouble(dtDataList.Rows[i]["Value"]) / d_Num).ToString("0.00");//人均面积值  
                        }
                        d_DW = dtDataList.Rows[i]["F_EnergyItemUnit"].ToString();//单位
                        ss.Append("     <tr style=\" height:50px; background-color:#EDFAEF;\"> ");
                        ss.Append("          <td style=\" width:150px;\"> ");
                        ss.Append("         <span style=\" font-family:微软雅黑; font-size:18px;\">" + d_ElecName + "</span> ");
                        ss.Append("         </td> ");
                        ss.Append("         <td align=\"center\"  style=\" width:400px;\"> ");
                        ss.Append("                 <span style=\" font-family:微软雅黑;  color:#10CB37; font-size:24px;\">" + d_DWValue + "</span>");
                        ss.Append("                  <span style=\"color: #598E59;\">单位面积能耗 " + d_DW + "/㎡</span> ");
                        ss.Append("         </td>");
                        ss.Append("            <td align=\"center\" style=\" width:400px;\"> ");
                        ss.Append("                  <span style=\" font-family:微软雅黑;  color:#10CB37; font-size:24px;\">" + d_RJValue + "</span>");
                        ss.Append("                  <span style=\"color: #598E59;\">单位面积能耗<br /> " + d_DW + "/人</span> ");
                        ss.Append("         </td>");
                        ss.Append("     </tr> ");
                    }
                }
                ss.Append(" </table> ");
                changs.InnerHtml = ss.ToString();  //把拼接后的table显示到前台
            }
            else
            {
                lblcg.Visible = false;
            }
                   

注意的是 当你给table 设置样式的时候 需要 加上 //     例如:   ss.Append(" <table style=\"width: 93%;  border-top:2px solid #33CC00; border-bottom:2px solid #33CC00;\"> ");