2

我正在尝试将 Select 元素与 Dojo 商店联系起来。Select 元素是在 HTML 中声明的，我试图在一些 JavaScript 代码中给它一个商店。

似乎Dojo 文档不建议这样做，并且支持在使用商店时以编程方式创建 Select 元素。然而，这对我来说是一个黄旗，因为我喜欢将 HTML 元素的创建与它们的行为分开。在这种情况下，如果我可以将 Select 元素保留在 HTML 中并在 JavaScript 中连接商店，那将是理想的选择。

Dojo 文档中的声明真的是“最佳实践”吗？我正在寻找经验丰富的 Dojo 开发人员的意见，因为我仍然对 Dojo 感兴趣。

4

2 回答 2

1

直觉上，人们会select.set("store", store)像所有小部件一样将存储分配/更改为 dijit dojo/Stateful，但令人惊讶的是它不起作用。

无论如何，有一种方法select.setStore(store, selectedValue, fetchArgs)（也令人惊讶）未被弃用并且有效。

定义dijit/form/Select没有商店：

<select id="select1" data-dojo-type="dijit/form/Select"></select>​

为其分配一个商店：

require([
    "dojo/ready",
    "dijit/registry",
    "dojo/store/Memory",
], function(
    ready, registry, Memory
) {

    ready(function() {

        var store1 = new Memory({
            idProperty: "value",
            data: [
                { value: "AL", label: "Alabama" },
                { value: "AK", label: "Alaska" },
                { value: "AZ", label: "Arizona" }
            ]           
        });

        var select1 = registry.byId("select1");
        select1.set("labelAttr", "label");
        select1.setStore(store1, "AZ");       
    });
});

在 jsFiddle 上查看它的实际效果：http: //jsfiddle.net/phusick/ZmsY ​​V/

将一些UX糖添加到上述我将dijit/form/Select disabled使用单个选项创建，例如Loading...及其最终期望width：

<select
    id="select1"
    data-dojo-type="dijit/form/Select"
    data-dojo-props="disabled:true"
    style="width:150px;"
>
    <option>Loading...</option>
</select>​

然后我会在调用后启用它setStore()：

var select1 = registry.byId("select1");
select1.set("labelAttr", "label");
select1.setStore(store1);
select1.set("disabled", false);

在工作中查看此增强版：http: //jsfiddle.net/phusick/xdDEm/

于 2012-10-08T14:15:39.233 回答
0

以声明方式调试错误的存储数据/定义可能会变得非常讨厌。此外，当您尝试按照声明式构建的选择/存储组合创建多个相同的小部件时，您可能会遇到奇怪的烦恼。例如（伪代码）：

<div dojotype="dojox.data.QueryReadStore" url="someurl/blah.do" jsId="mystore"/>
<select dojotype="dijit.form.FilteringSelect" store="mystore">
</select>

理论上，通过将 mystore 绑定到 select 来执行您想要的操作，但是如果您要创建多个此小部件，您将与“mystore”发生 id 冲突。作为一种解决方法，您必须为 jsId 和商店的 id 执行类似 jsId="${id}_mystore" 的操作。

如果您想保持声明性行为，一种选择是为您的商店和您的选择都拥有附加点，那么您可以在初始化后简单地调用 selectwidget.set("store",mystore) 。

于 2012-10-08T21:14:38.837 回答