0

我有一个包含一组数据的 XML 文件，它必须在 HTML 页面的许多 dojo 内容窗格之一中表示。我试过 dojox.grid.DataGrid 并且它有效；但是，由于数据网格通常用于表示表格数据，因此我不想使用数据网格。

有没有其他方法可以以简单的格式表示这些数据？

XML 文件是这样的：

<Summary>
   <neName>abc</neName>
   <neType>pqr</neType>
   <neRelease>2.0</neRelease>
   <neAddress>10.10.82.105</neAddress>
   <supervisionState>SUPERVISED</supervisionState>
   <operationalState>ENABLED</operationalState>
   <alignmentState>ALIGNED</alignmentState>
   <criticalAlarms>0</criticalAlarms>
   <majorAlarms>0</majorAlarms>
   <minorAlarms>0</minorAlarms>
   <noOfShelves>5</noOfShelves>
</Summary>

我希望这些数据表示如下：

在此处输入图像描述

4

2 回答 2

2

从您希望数据的外观来看，我会选择cssHTML 元素的基本样式，而不是任何小部件。

但是，您可以使用dgrid，

查看：

https://github.com/SitePen/dgrid/

http://www.sitepen.com/blog/category/dgrid/

于 2012-06-04T08:42:50.067 回答
1

如果您感觉很活泼，可以制作一种通用的 XML 数据小部件。这是我前段时间的一个例子。

dojo.declare("foo.XmlDisplay", dijit._Widget, {

    postCreate: function()
    {
        this.inherited(arguments);
        dojo.xhrGet({
            url: this.href,
            handleAs: "xml",
            load: dojo.hitch(this, "setData")
        });

    },

    setData: function(data)
    {
        // All items with a xmldisp-tag attribute should get data
        dojo.query("*[data-xmldisp-tag]", this.containerNode).forEach(
            function(item) {
                var tag   = dojo.attr(item, "data-xmldisp-tag");
                var value = data.getElementsByTagName(tag);
                if(value.length == 1) item.innerHTML = value[0].textContent;
                else console.warn("No data in xml for",tag);
            }
        );
    }
});

然后，您可以在 HTML 中使用类似这样的东西（即小部件不关心您如何显示数据，它只是使用给定的标签名称从服务器查找 XML 中的数据）：

<div data-dojo-type="foo.XmlDisplay" href="/MyXmlStuff?id=42">
    <dl>
        <dt>NE name</dt><dd data-xmldisp-tag="nename">-</dd>
        <dt>NE type</dt><dd data-xmldisp-tag="netype">-</dd>
    </dl>
    <dl>
        <dt>Alarms</dt><dd data-xmldisp-tag="majoralarms">-</dd>
        <dt>Minor</dt><dd data-xmldisp-tag="minoralarms">-</dd>
    </dl>
</div>

这是一个修改后的 jsfiddle，您可以尝试：http ://fiddle.jshell.net/K4UnJ/3/

不确定这是否完全适合您的任务，但由于我有非常相似的代码，我想我会分享。

于 2012-06-04T10:58:08.370 回答