如何在Javascript中从XML动态填充行到现有表中

时间:2015-09-21 17:20:12

标签: javascript html asp.net xml

我需要动态填充行到现有HTML 表的正文部分。 行和值在XML字符串中定义,来自数据库。我尝试了几件事:从某种方式克隆行,以及其他各种尝试。没有图书馆!它是一个仅在IE中运行的遗留应用程序。有什么想法吗? THX!

此函数应构建并插入行:

function makeRows (xmldoc, schema, id) {

    var body = document.getElementById(id);
    var xmlrows = xmldoc.getElementsByTagName("ROW");

    for (var i = 0; i < xmlrows.length; i++) {
      var xmlrow = xmlrows[i];
      var row = document.createElement("tr");

      for (var x = 0; x < schema.columns.length; x++) {
        var sc = schema.columns[x];
        var tagname = sc.tagname;
        var xmlcell = xmlrow.getElementsByTagName(tagname)[0];
        var cell = document.createElement("td");
        var celltext = xmlcell.text;
        cell.appendChild(document.createTextNode(celltext));
        cell.innerText = celltext;
        row.appendChild(cell);
      }

      body.appendChild(row);
    }
  }

函数调用和架构:

var schema = {
        rowtag: "ROW",
        columns: [
            { tagname: "C1", label: "C1" },
            { tagname: "C2", label: "C2" },
            { tagname: "C3", label: "C3" }
        ]
      };

var xmldoc = new ActiveXObject("Microsoft.XMLDOM");
xmldoc.async = false;
xmldoc.loadXML(xml); // xml = XML as string, not declared here

makeRows(xmldoc, schema, "body");

HTML表格和XML:

<table id="table">
  <colgroup>
    <col>
    <col>
    <col>
  </colgroup>
  <thead>
    <tr>
      <th name="A">A</th>
      <th name="B">B</th>
      <th name="C">C</th>
    </tr>
  </thead>
  <tbody id="body">
    // Here: must be filled with rows from XML
  </tbody>
</table>

-------
<?xml version="1.0" encoding="UTF-8" ?>
<XML_FILE>
  <ROW>
    <C1></C1>
    <C2>some value</C2>
    <C3>some value</C3>
  </ROW>
  <ROW>
    <C1>some value</C1>
    <C2>some value</C2>
    <C3>some value</C3>
  </ROW>
</XML_FILE>

0 个答案:

没有答案