AjaxPro取后台数据动态显示表格

<style type="text/css">
               #apDiv1 { Z-INDEX: 1; LEFT: 10%; BORDER-BOTTOM-COLOR: #333333; WIDTH: 60%; POSITION: relative; HEIGHT: 100%; BACKGROUND-COLOR: #cccccc } #tbody { PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; PADDING-TOP: 5px; BACKGROUND-COLOR: #6e6e6e; TEXT-ALIGN: left } </style>
              <script src="lib/jquery.js" type="text/javascript"></script>
              <script src="custom.js" type="text/javascript"></script>
              <script src="lib/jquery.tablesorter.js" type="text/javascript"></script>
              <script type="text/javascript">
                                   $(document).ready(function() {
                                          $("#large").tableSorter();
                                   });
              </script>
              <script language="javascript" type="text/javascript">  
                  function  ShowData()
                   {
                         var tableData=AjaxProPractise.WebForm1.GetData().value;  
                      var tb1,tbd,tr,td;
                      var theads;                      
                      var maxrow=tableData.Rows.length;
                      var maxcol=tableData.Columns.length;  //success                    
                                      tb1= document.getElementById("large");                                      
                                      theads=document.createElement("thead");
                                      tb1.appendChild(theads);                                
                                      for(var i=0;i<1;i++)
                                      {
                                             tr= document.createElement("tr");
                              theads.appendChild(tr);    
                                              for(var col_count=0;col_count<maxcol;col_count++)                                  
                                               {
                                                td=document.createElement("td");      
                                                td.innerHTML=tableData.Columns[col_count].Name;//
                                                tr.appendChild(td);                              
                                           }                                      
                                      }//tbd= document.createElement("tbody"); // tb1.appendChild(tbd);
                                       tbd= document.getElementById("TBody0");                            
                        for(var row_count=0;row_count<tableData.Rows.length;row_count++)
                        {
                           tr= document.createElement("tr");
                           tbd.appendChild(tr);                                                
                             for(var col_count=0;col_count<tableData.Columns.length;col_count++)      
                                  {            
                                        td=document.createElement("td");        
                                                                   var   colNa=tableData.Columns[col_count].Name;//取到列名了                                                                                                                                                                                                      
                                                                   var   value=  tableData.Rows[row_count][tableData.Columns[col_count].Name];                                  
                                                     td.innerHTML=value;                                                                                                                                    
                                              tr.appendChild(td);                                                                
                                  }
                         }        
                        // var  taTotal= document.getElementById("taTotal");  
                        var totalNum=0;              
                         var  bodyTotal=document.getElementById("bodyTotal"); //total    
                            tr= document.createElement("tr");
                            bodyTotal.appendChild(tr);
                            for(var col_count=0;col_count<tableData.Columns.length;col_count++)
                            {
                                td=document.createElement("td");
                                if(col_count==0)                              
                                          td.innerHTML='合计';
                                else
                                {                                    
                                    var      value=  tableData.Rows[0][tableData.Columns[col_count].Name];   //judge the value type(number)
                                    if(typeof value=='number'&&value.constructor==Number)//the value is number
                                    {
                                        for(var row_count=0;row_count<tableData.Rows.length;row_count++)
                                                           {                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      
                                                                                        totalNum=tableData.Rows[row_count][tableData.Columns[col_count].Name]+totalNum;                                  
                                                                          td.innerHTML=totalNum;                                                                                                                                                                                                                                                                
                                          }                                                                                
                                    }
                                    else                                  
                                    td.innerHTML='  ';                                                                  
                                }                              
                                tr.appendChild(td);        
                            }                                                                                                                                                                                                                                                                                                                                                                                                                              
                }                                                                                                                                
              </script>
       </HEAD>
       <body MS_POSITIONING="GridLayout" onload="ShowData();">
              <form id="Form2" method="post" runat="server">
                     <div id="apDiv1" class="apDiv1" align="center" style="Z-INDEX: 101; LEFT: 160px; WIDTH: 60%; TOP: 48px; HEIGHT: 86.09%">
                            <table align="center" id='large' border='2' cellpadding='3' cellspacing='0' style='BORDER-RIGHT:#c1cdd8 1px solid; BORDER-TOP:#c1cdd8 1px solid; FONT-SIZE:9pt; BORDER-LEFT:#c1cdd8 1px solid; BORDER-BOTTOM:#c1cdd8 1px solid; BORDER-COLLAPSE:collapse'
                                   width="100%">
                                   <!--暂时没有数据-->
                                   <tbody id='TBody0' class="tbody">
                                   </tbody>
                            </table>                        
                            <table align="center" id='taTotal' border='2' cellpadding='3' cellspacing='0' style='BORDER-RIGHT:#c1cdd8 1px solid; BORDER-TOP:#c1cdd8 1px solid; FONT-SIZE:9pt; BORDER-LEFT:#c1cdd8 1px solid; BORDER-BOTTOM:#c1cdd8 1px solid; BORDER-COLLAPSE:collapse'

                                   width="100%">
                                   <!--暂时没有数据-->
                                   <tbody id='bodyTotal' class="tbody">
                                   </tbody>
                            </table>
                     </div>
                     <FONT face="宋体"></FONT>
              </form>
       </body>
posted @ 2009-12-18 17:49  adriana  阅读(364)  评论(0)    收藏  举报