Dojo 小部件在响应 XhrPost 时返回时不呈现

Posted 2023-02-24

【中文标题】Dojo 小部件在响应 XhrPost 时返回时不呈现

【英文标题】：Dojo Widgets not rendering when returned in response to XhrPost

【发布时间】：2011-02-06 02:44:41

【问题描述】：

我正在尝试在 Dijit Tree 小部件中捕获所选项目以呈现网页的剩余部分。这是捕获所选项目并将其发送到 Django 后端的代码：

      <div dojoType="dijit.Tree" id="leftTree" store="leftTreeStore" childrenAttr="folders" query="type:'folder'" label="Explorer">
      <script type="dojo/method" event="onClick" args="item">
        alert("Execute of node " + termStore.getLabel(item));
        var xhrArgs = 
          url: "/load-the-center-part-of-page",
          handleAs: "text",
          postData: dojo.toJson(leftTreeStore.getLabel(item), true),
          load: function(data) 
            dojo.byId("centerPane").innerhtml = data;
            //window.location = data;
          ,
          error: function(error) 
            dojo.byId("centerPane").innerHTML = "<p>Error in loading...</p>";
          
        
        dojo.byId("centerPane").innerHTML = "<p>Loading...</p>";
        var deferred = dojo.xhrPost(xhrArgs);
      </script>
    </div>

页面的其余部分包含带有 dojo 小部件的 HTML 代码。这是作为“响应”发送回选择项事件的代码。这是一个sn-p：

<div dojoType="dijit.layout.TabContainer" id="tabs" jsId="tabs">
 <div dojoType="dijit.layout.BorderContainer" title="Dashboard">
   <div dojoType="dijit.layout.ContentPane" region="bottom">
    first tab
   </div>
 </div>
 <div dojoType="dijit.layout.BorderContainer" title="Compare">
  <div dojoType="dijit.layout.ContentPane" region="bottom">
    Second Tab
  </div>
 </div>
</div>

它呈现这个 html 的“响应”，但没有 dojo 小部件。 XhrPost 中的 handleAs: "text" 是这里的罪魁祸首吗？

【问题讨论】：

- 在 'dojo.byId("centerPane").innerHTML = data' 之后添加 dojo.parser.parse(dojo.byId("centerPane")) 也没有帮助。 - 添加样式信息 (class="soria") 也没有帮助。

【参考方案1】：

我的猜测是您的 Tabs 和 BorderContainer 没有高度。它们不会自动附加到父容器，您必须明确它们的大小。 dojo.parser.parse 部分是必需的，具体取决于您注入内容的方式，但如果“centerPane”是 ContentPane，您只需 attr("content", response) 并为您完成解析。此外，所有 BorderContainer 都需要一个 region="center" （一个），并且您的上述 sn-ps 都不包含一个。

【讨论】：

问题出在以下 LOC：dojo.byId("centerPane").innerHTML = data;用以下几行替换它完成了工作 dijit.byId("centerPane").innerHTML = data; dojo.parser.parse(dijit.byId("centerPane"));您建议的另一个解决方案也有效：dijit.byId("centerPane").attr("content", data);

另外，您可以使用contentpane.attr("href","newuri.html")，而不是遍历所有xhr“废话”，解析器也会被调用并为您处理所有xhr内容。

【参考方案2】：

请注意，.innerHTML 字段适用于 DOM 对象，而不适用于 Dojo 对象。我认为你应该使用 dojo.byId("centerPane").containerNode.innerHTML = ...

补充：我查看了 dijit.byId 的文档，它是这样说的：

dijit.byId 是一个通过其查找特定小部件的函数 指定名称 (id)。此函数类似于 dojo.byId 但 dojo.byId 返回 DOMNodes，dijit.byId 返回一个 javascript 对象 那是小部件的实例。

这就是它对你有用的原因。