0

我正在将小部件添加到可以在此链接中找到的 ERSI 地图查看器项目中。

所以我制作了一个带有 dijit/form/button 的查询小部件，并希望实现一个 dojo/on 事件侦听器来侦听其单击事件。

该按钮在 html 标记中声明为：

<button data-dojo-type="dijit.form.Button" id="searchButton" type="button">Submit</button>

在我的 JavaScript 中，在 postCreate 函数的末尾，我有：

on(dojo.byId("searchButton"), "click", function execute() {
    // Set the WHERE search text
    this.findParams.searchText = dojo.byId("searchText").value;
    // Sends a request to the ArcGIS REST map service resource to perform a search based
    // on the FindParameters specified in the findParameters argument. On completion, the
    // onComplete event is fired and the optional callback function is invoked.
    this.findTask.execute(this.findParams, this.showResults, this.showError);
});

我收到一个 TypeError: _526 is null。这个错误似乎可以忽略不计，因为我知道我做错了。除了上面的代码，我尝试了几十个其他代码，但没有任何效果。

我为dojo/on找到的所有示例都没有显示如何执行这个特定的应用程序。

我对 dojo 还是很陌生，我只是在这个项目上，直到我可以解决另一个同事遇到的一些问题，但是如果有人可以向我展示一个示例或链接到一个示例，该示例显示如何侦听 DOM dijit 事件在一个小部件中，将不胜感激。

回答后更新的代码：

如果下一个人觉得有用，我稍微更改了代码：

on(this.submitButton, 'click', lang.hitch(this, 'execute'));

其中 execute 与之前列出的函数相同，但为了使这一行更简洁。

4

2 回答 2

2

我假设您的查询小部件是模板化小部件，并且还混合在 WidgetsInTemplateMixin 中。

http://dojotoolkit.org/reference-guide/1.9/dijit/_TemplatedMixin.html#dijit-templatedmixin

http://dojotoolkit.org/reference-guide/1.9/dijit/_WidgetsInTemplateMixin.html#dijit-widgetsintemplatemixin

您发布的 html 在小部件模板中。您最好的选择是不使用 id。通过使用 id，您将只能在页面上拥有这些小部件之一。这对于您的用例可能没问题，但不是一个好习惯。相反，使用data-dojo-attach-point.

<div>
    ... MORE HTML...
    <button data-dojo-type="dijit.form.Button" 
        data-dojo-attach-point="submitButton" type="button">Submit</button>
</div>

在您的代码中，您可以将其submitButton作为小部件的变量进行引用。

on(this.submitButton, "click", function execute() {
    ...
}
于 2013-07-03T15:16:30.110 回答
0

由于您的按钮本身是一个小部件，因此您不需要 dojo/on 来拦截点击事件。

假设您将“dijit/registry”放在小部件的依赖项列表中，请尝试：

registry.byId("searchButton").on("click", function execute() {
    // Set the WHERE search text
    this.findParams.searchText = dojo.byId("searchText").value;
    // Sends a request to the ArcGIS REST map service resource to perform a search based
    // on the FindParameters specified in the findParameters argument. On completion, the
    // onComplete event is fired and the optional callback function is invoked.
    this.findTask.execute(this.findParams, this.showResults, this.showError);
});

您遇到错误的原因是因为当您这样做时...

<button data-dojo-type="dijit.form.Button" id="searchButton" type="button">Submit</button>

...您创建一个 id 为“searchButton”的小部件。虽然在呈现小部件模板时节点本身不再具有该 ID。因此不能通过 dom.byId 引用它。

如果您想引用小部件的 domNode，您需要执行以下操作：

registry.byId("searchButton").domNode

如果您查看这个 fiddle，您会发现 Button domNode 根本没有 id。如果现在您在 Firebug 或浏览器控制台中查看该按钮的 html，您会注意到 domNode 具有属性“widgetid=btn2”而不是“id=btn2”。

于 2013-07-03T16:26:47.887 回答