dijit.form.filteringselect dynamiquement modifier les options

Question

j'ai une composante dijit.form.FilteringSelect et je veux changer les options dynamiquement. Mais je reçois le magasin de la dijit.form.FilteringSelectwith sa propriété de magasin; il n'y a pas de fonction de réglage dans le magasin. (Il peut être un dojo.store.Reader)

Alors, comment puis-je changer l'option de dijit.form.FilteringSelect? Dois-je le changer directement avec DOM? Y at-il un moyen de mettre à jour le magasin derrière dijit.form.FilteringSelect?

Answer 1

il y a deux types de magasin de données Dojo:

1. dojo.data.ItemFileReadStore - readonly datastore

2. dojo.data.ItemFileWriteStore - l'extension de ItemFileReadStore qui ajoute à la dojo.data.api.Write

   Dans votre cas, vous devriez utiliser ItemFileWriteStore - il fournit des fonctions pour modifier les données en magasin.

Par exemple:

Vous avez éventail de pays et que vous voulez l'utiliser dans le filtrage choisi:

[{ 
    abbr: 'ec', 
    name: 'Ecuador', 
    capital: 'Quito' 
}, 
{ 
    abbr: 'eg', 
    name: 'Egypt', 
    capital: 'Cairo' 
}, 
{ 
    abbr: 'et', 
    name: 'Ethiopia', 
    capital: 'Addis Ababa' 
}] 

d'abord, vous devez créer variable de banque de données pour ItemFileWriteStore .

<script> 
    dojo.require("dojo.data.ItemFileWriteStore"); 
    dojo.require("dijit.form.FilteringSelect"); 

    var storeData = { 
     identifier: 'abbr', 
     label: 'name', 
     items: //YOUR COUTRIES ARRAY 
     } 
</script> 

Étape suivante - Constater le filtrage de sélection et itemFileWriteStore dans les balises html:

<div dojotype="dojo.data.ItemFileWriteStore" data="storeData" jsid="countryStore"></div> 
<div dojotype="dijit.form.FilteringSelect" store="countryStore" searchattr="name" id="filtSelect"></div> 

Et enfin créer des fonctions spéciales pour ajouter/supprimer/modifier des éléments dans le filtrage sélectionnez:

Ajouter un nouvel élément:

function addItem() { 
    var usa = countryStore.newItem({ abbr: 'us', name: 'United States', capital: 'Washington DC' }); 
} 

J'espère ici est clair. Seule petite note: champ « identifiant » (« abbr » dans notre cas) doit être unique en magasin

Supprimer les éléments - par exemple supprimer tous les articles avec le nom « Etats-Unis d'Amérique »

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 }); 
} 

Comme vous pouvez le voir, j'ai créé requête, qui trouve des éléments avec le nom == « Etats-Unis d'Amérique » en magasin de données. Après l'exécution de la requête, la fonction "gotNames" sera appelée. gotNames fonction supprime tous les éléments qui renvoient la requête.

et dernière fonction - Modifier l'élément

est similaire à la fonction de suppression. une seule différence:

vous devez utiliser la méthode setValue() de itemFileWriteStore pour changer la propriété d'article:

countryStore.setValue(item, "name", newValue); 

Here - page with working example

Answer 2

Je résolu le même problème avec cette phrase, il aide quelqu'un l'espoir.

Pour Dojo Version < 1,7

dijit.byId('myId').store.root[{index of select}].innerText='New text'; 

dijit.byId('myId').store.root[{index of select}].value='New Value'; 

Pour Dojo version> = 1,7

dijit.byId('myId').store.data[{index of select}].name='New Text'; 

dijit.byId('myId').store.data[{index of select}].value='New Value'; 

Pour changer affiché texte (courant sélectionné)

dijit.byId('myId').textbox.value='New text'; 

Vous peut voir ces propriétés en utilisant Firebug ou une autre console de débogage.

Answer 3

les propriétés de la urlPreventCache: true, clearOnClose: true 'forcera la boutique à recharger

<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> 

puis, sur l'événement/rappel/gestionnaire où vous avez besoin/voulez réinitialiser les valeurs faites juste ceci

function func-name() { 
    clientStore.url = "../json/GetClients?param=<your-new-search-conditions>"; 
    clientStore.close(); 
}