title: javascript function to generate table using javascript
body: <p>given a mixed-use table like below, how can i create a function that generates the same table structure.</p>
  
  <p>PS: this is legacy code hence the taglib mixed syntax unfortunately</p>
  
  <p><strong>table to be generated</strong>:</p>
  
  <pre><code>&lt;% if (boolVar) { %&gt;
  &lt;img src="../graphics/dot.gif" width="70%" border="0" height="1"&gt;&lt;br&gt;
      &lt;table id="&lt;%=tableName%&gt;" width="70%" cellpadding="0" cellspacing="0" border="0"&gt;
          &lt;tr class="titletextrow"&gt;           
              &lt;td class="leftbartextbold" colspan="5" height="14"&gt;&amp;nbsp;TableNameHere&lt;/td&gt;            
          &lt;/tr&gt;       
          &lt;tr&gt;
              &lt;td&gt;&lt;/td&gt;
              &lt;td class="label"&gt;Column1Name&lt;/td&gt;
              &lt;td width="60%"&gt;&lt;/td&gt;           
              &lt;td class="label"&gt;Column2Name&lt;/td&gt;
              &lt;td&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;logic:iterate id="someList" name="someForm" property="someList" scope="request" indexId="someIndex"&gt;
          &lt;SCRIPT&gt; currentRow&lt;%=tableName%&gt; += 1; 
                  &lt;/SCRIPT&gt;
            &lt;%}%&gt;
          &lt;% currentRow += 1; %&gt;              
      &lt;/logic:iterate&gt;
      &lt;/table&gt;
  </code></pre>
  
  <p><strong>Possible approach</strong>
  I was thinking of using something along the lines of appending the <code>document.write</code> parameters as appended strings but because of the mixed-use taglib syntax, it will be messy. Any suggestions? Examples directly relevant to this problem will be hugely appreciated!</p>
  
  <pre><code>&lt;script&gt;
      function create() {
          var row = parseInt(document.getElementById("row").value);
          var col = parseInt(document.getElementById("col").value);
  
  
          var tablestart = "&lt;table id=myTable border=1&gt;";
          var tableend = "&lt;/table&gt;";
          var trstart = "&lt;tr bgcolor=#ff9966&gt;";
          var trend = "&lt;/tr&gt;";
          var tdstart = "&lt;td&gt;";
          var tdend = "&lt;/td&gt;";
          var data = "data in cell";
  
          var str1 = tablestart + trstart + tdstart + data + tdend + trend + tableend;
  
          document.write(tablestart);
          for (var r = 0; r &lt; row; r++) {
              document.write(trstart);
              for (var c = 0; c &lt; col; c++) {
                  document.write(tdstart + "Row." + r + " Col." + c + tdend);
              }
          }
          document.write(tableend);
      }
  &lt;/script&gt;
  </code></pre>