javascript dijit.form.filteringselect 动态更改选项
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5707021/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
dijit.form.filteringselect dynamically change options
提问by cn1h
I have a dijit.form.FilteringSelectcomponent and I want to change the options dynamically. But I get the store from the dijit.form.FilteringSelectwith its store property; there is no setter function in the store. (It may be a dojo.store.Reader)
我有一个dijit.form.FilteringSelect组件,我想动态更改选项。但是我从 dijit.form.FilteringSelect 和它的 store 属性得到了商店;商店中没有设置器功能。(它可能是一个 dojo.store.Reader)
So how can I change the option of dijit.form.FilteringSelect? Should I change it directly with DOM? Is there any way to update the store behind dijit.form.FilteringSelect?
那么如何更改 的选项dijit.form.FilteringSelect?我应该直接用 DOM 改变它吗?有没有办法更新后面的商店dijit.form.FilteringSelect?
回答by Andrei
there is two type of data store in dojo:
dojo 中有两种类型的数据存储:
- dojo.data.ItemFileReadStore- readonly datastore
dojo.data.ItemFileWriteStore- extension of ItemFileReadStore that adds on the dojo.data.api.Write
In your case, you should use ItemFileWriteStore - it provides functions for modifying data in store.
- dojo.data.ItemFileReadStore- 只读数据存储
dojo.data.ItemFileWriteStore- 添加在 dojo.data.api.Write 上的 ItemFileReadStore 的扩展
在您的情况下,您应该使用 ItemFileWriteStore - 它提供了修改存储中数据的功能。
E.g.:
例如:
You have array of countries and you want to use it in filtering select:
您有多个国家/地区,并且希望在过滤选择中使用它:
[{
abbr: 'ec',
name: 'Ecuador',
capital: 'Quito'
},
{
abbr: 'eg',
name: 'Egypt',
capital: 'Cairo'
},
{
abbr: 'et',
name: 'Ethiopia',
capital: 'Addis Ababa'
}]
First of all you will need to create data store js-variable for ItemFileWriteStore.
首先,您需要为 ItemFileWriteStore 创建数据存储 js 变量。
<script>
dojo.require("dojo.data.ItemFileWriteStore");
dojo.require("dijit.form.FilteringSelect");
var storeData = {
identifier: 'abbr',
label: 'name',
items: //YOUR COUTRIES ARRAY
}
</script>
Next step - declare filtering select and itemFileWriteStore in html markup:
下一步 - 在 html 标记中声明过滤选择和 itemFileWriteStore:
<div dojotype="dojo.data.ItemFileWriteStore" data="storeData" jsid="countryStore"></div>
<div dojotype="dijit.form.FilteringSelect" store="countryStore" searchattr="name" id="filtSelect"></div>
And finally create special functions for add/delete/modify items in filtering select:
最后为过滤选择中的添加/删除/修改项目创建特殊功能:
Add New Item:
添加新项目:
function addItem() {
var usa = countryStore.newItem({ abbr: 'us', name: 'United States', capital: 'Washington DC' });
}
I hope here is all clear. Only small note: "identifier" field ("abbr" in our case) must be unique in store
我希望这里一切都清楚。只有一个小注意事项:“标识符”字段(在我们的例子中是“缩写”)在商店中必须是唯一的
Delete Items - e.g. removing all items with name "United States of America"
删除项目 - 例如删除所有名称为“美利坚合众国”的项目
function removeItem() {
var gotNames = function (items, request) {
for (var i = 0; i < items.length; i++) {
countryStore.deleteItem(items[i]);
}
}
countryStore.fetch({ query: { name: "United States of America" }, queryOptions: { ignoreCase: true }, onComplete: gotNames });
}
As you can see i have created query, that finds items with name == "United States of America" in data store. After the query is executed, function "gotNames" will be called. function gotNames removes all items that query return.
如您所见,我创建了查询,它在数据存储中查找名称 ==“美利坚合众国”的项目。执行查询后,将调用函数“gotNames”。函数 gotNames 删除查询返回的所有项目。
And last function - Edit Item
最后一个功能 - 编辑项目
it is similar to the delete function. only one difference:
它类似于删除功能。只有一个区别:
you should use setValue()method of itemFileWriteStore for changing item property:
您应该使用setValue()itemFileWriteStore 的方法来更改项目属性:
countryStore.setValue(item, "name", newValue);
回答by Rodrigo
I solved the same problem with this sentences, hope it helps someone.
我用这句话解决了同样的问题,希望对某人有帮助。
For Dojo version < 1.7
对于Dojo 版本 < 1.7
dijit.byId('myId').store.root[{index of select}].innerText='New text';
dijit.byId('myId').store.root[{index of select}].value='New Value';
For Dojo version >= 1.7
对于Dojo 版本 >= 1.7
dijit.byId('myId').store.data[{index of select}].name='New Text';
dijit.byId('myId').store.data[{index of select}].value='New Value';
To change displayed text (current selected)
更改显示的文本(当前选定的)
dijit.byId('myId').textbox.value='New text';
You can see this properties using Firebug or another debug console.
您可以使用 Firebug 或其他调试控制台查看此属性。
回答by Legna
the properties 'urlPreventCache:true, clearOnClose:true' will force the store to be reloaded
属性 'urlPreventCache:true, clearOnClose:true' 将强制重新加载存储
<div data-dojo-type="eco/dojo/data/ItemFileReadStore" data-dojo-props='url:"../json/GetClients", urlPreventCache:true, clearOnClose:true' data-dojo-id="clientStore" ></div>
<div id=proposalClient data-dojo-type="dijit/form/FilteringSelect" data-dojo-props="store:clientStore, searchAttr:'clientName', required:'true', pageSize:'15'" ></div>
and then, on event/callback/handler where you need/want to reset the values just do this
然后,在您需要/想要重置值的事件/回调/处理程序上执行此操作
function func-name() {
clientStore.url = "../json/GetClients?param=<your-new-search-conditions>";
clientStore.close();
}

