javascript前台动态生成表格

javascript文章/教程1年前 (2023)发布勤奋小助

0 0

  1 window.onload = function()
  2         {                        
  3             refreshList();        
  4         }    
  5                 
  6         function refreshList(){
  7             var result = eval("("+'{!JSONAccount}'+")");    
  8             //alert("result: " + result);        
  9             var n, count = 0;   
 10             for(n in result){   
 11                if(result.hasOwnProperty(n)){   
 12                   count++;   
 13                }   
 14             }  
 15                          
 16             var tableInfo = "Id#Name#City#ZIP";            
 17             var i = 0;
 18             for(i = 0;i<count;i=i+1)
 19             {
 20                 tableInfo = tableInfo + "#" + result[i].Id + "#" + result[i].Name + "#" + result[i].BillingCity + "#" + result[i].BillingPostalCode;
 21             }            
 22             tableCreate(count+1,4,tableInfo);            
 23             /*    
 24             var table = document.getElementById("EventInfo");
 25             var i = 0;
 26             for(i=0;i<count;i=i+1){
 27                 var tr = table.insertRow();
 28                 for(el in result[i])
 29                 {
 30                     var td = tr.insertCell();
 31                     td.innerHTML = result[i][el];
 32                 }
 33             } 
 34 */        
 35         }
 36         
 37         function tableCreate(row,col,tableVal){
 38               if ((row=="") || (row=="") || (tableVal=="")){
 39                 alert("table information is not complete");
 40               }
 41               else{
 42                 r=parseInt(row);
 43                 c=parseInt(col);
 44                 Table1(row,col,tableVal);
 45               }
 46         }
 47         
 48         function Table1(row,col,Str1)
 49         {    
 50             var str="";
 51               a=new Array();
 52               s=new String(Str1);
 53               a=s.split("#");
 54               int1=a.length;
 55               ai=0;
 56               if (col<=int1)
 57               {
 58                   str=str+"<div id='tableHead'><table width='300' border='4' id='account_table'>";
 59                 for (i=0;i<col;++i)
 60                 {
 61                     if (i==0)
 62                      {
 63                           str=str+"<tr><th scope='col'>&nbsp;"+(a[ai++])+"</th>";
 64                      }
 65                      else
 66                      {
 67                         if (i==(col-1))
 68                         {
 69                           str=str+"<th scope='col'>&nbsp;"+(a[ai++])+"</th></tr></table></div>";
 70                         }
 71                         else
 72                         {
 73                           str=str+"<th scope='col'>&nbsp;"+(a[ai++])+"</th>";
 74                         }
 75                      }
 76              }
 77               if (int1>col)
 78               {
 79                   if (row>1)
 80                   {
 81                     str=tablevalue(a,ai,row-1,col,str);  
 82                   }
 83                }   
 84             str=str+ "</table><div class='tableValue'>test</div></div>";
 85         //    document.getElementById("accounts").innerHTML=str;
 86             
 87             
 88           }
 89         }
 90         
 91         function tablevalue(a,ai,rows,col,str)
 92         {
 93               int1=a.length;
 94               for (i=0;i<rows;++i)
 95               {
 96                 for (j=0;j<col;++j)
 97                 {
 98                       if ((j==0)&&(ai>=int1))
 99                       {
100                           break;
101                       }
102                       if (ai>=int1)
103                       {
104                          str=str+"<td scope='col'>&nbsp;</td>";
105                       }
106                       else
107                       {
108                         if (j==0)
109                         {
110                             str=str+"<div class='tableValue'><table width='300' border='4' id='account_table'><tr id='tableTr'><td scope='col'>&nbsp;"+(a[ai++])+"</td>";
111                         }
112                         else
113                         {
114                             if (j==col-1)
115                             {
116                                 str=str+"<td scope='col'>&nbsp;"+(a[ai++])+"</td>";
117                               }
118                              else
119                              {
120                                   str=str+"<td scope='col'>&nbsp;"+(a[ai++])+"</td>";
121                               }          
122                     }
123                   }
124             }
125             str=str+"</tr></table></div>";
126           }
127           return str;
128     }