複雜的JSON結構+ Dojo選擇

Question

我有一個數據結構，我不知道如何正確管理它。 我必須使用Dojo，所以我選擇了JSON來解決這個問題。 我在說的結構是在這篇文章的底部。在閱讀以下文字之前請檢查它。

問題：我必須有3個選擇。第一個選擇將包含「第一級」（a，b，c）。第二個將包含「第二級」（aa，ab，...）等。

每個Select中的數據（第一個除外）中的數據應根據前一個Select中選擇的內容而有所不同。

例如，如果我在第一個選擇中選擇「a」，我應該只在第二個選擇中看到「aa，ab，ac」。那麼如果我在第二個選擇「ac」，我應該只看到「aca，acb，acc」。

請注意，有些情況下沒有「第三級」。在這種情況下，應該隱藏第三個選擇（如果它太難管理，則只能爲空）。

現在的參考。如果我在第一個選擇中選擇「d」，我應該只看到「aa，bc，ca」作爲第二個選擇的選項。然後，如果我在第二個選擇中選擇「cc」，我應該在第三個選擇中看到「cca，ccb，ccc」。當然，這不應該是靜態的。在我的例子中，如果「c - > cc」子樹會改變，「d - > cc」的內容也應該改變。

現在的問題：

1）我如何像使用Dojo的工作？如果是香草JS，這對我來說顯而易見，但我無法想象如何使它適用於所有這些對象商店等等。

2）我如何讓參考文獻適用於這種結構？我可以使它在一個簡單的JSON上工作，但當它變得如此複雜時，我完全失去了。

3）我如何呈現結構？作爲一個單一的JSON？或者我應該把它分成幾個部分？

提前致謝！

a 
    aa 
     aaa 
     aab 
    ab 
     aba 
    ac 
     aca 
     acb 
     acc 
b 
    ba 
    bb 
    bc 
     bca 
c 
    ca 
     caa 
     cab 
    cb 
     cba 
     cbb 
    cc 
     cca 
     ccb 
     ccc 
d 
    <ref to aa subtree> 
    <ref to bc subtree> 
    <ref to ca subtree> 

Answer 1

好了，你可以代表它作爲一個對象，例如：

var myData = { 
    a: { 
     aa: ['aaa', 'aab'], 
     ab: ['aba'], 
     ac: ['aca', 'acb', 'acc'] 
    }, 
    b: { 
     ba: null, 
     bb: null, 
     bc: ['bca'] 
    }, 
    c: { 
     ca: ['caa', 'cab'], 
     cb: ['cba', 'cbb'], 
     cc: ['cca', 'ccb', 'ccc'] 
    }, 
    d: {} 
}; 
myData.d.aa = myData.a.aa; 
myData.d.bc = myData.b.bc; 
myData.d.ca = myData.c.ca; 

但不管怎麼說，實現將是相當複雜的，以及。首先，我會建議編寫一個函數來獲取每個級別的標籤，具體取決於參數。例如：

var getObjectData = function(object) { 
    var data = []; 
    for (var key in object) { 
     if (object.hasOwnProperty(key)) { 
      data.push({ 
       name: key, 
       value: object[key] 
      }); 
     } 
    } 
    return data; 
}; 
var getData = function(obj) { 
    var data = []; 
    if (obj === undefined) { 
     return getObjectData(myData); 
    } else if (obj instanceof Array) { 
     return obj.map(function(value) { 
      return { 
       name: value, 
       value: null 
      }; 
     }); 
    } else { 
     return getObjectData(obj); 
    } 
    return data; 
}; 

這將返回應該是可用的存儲內部的適當的數據，包含標籤（「A」，「B」，「C」，...）和的對象結構下一級。

然後，你可以寫這樣的事情：

registry.byId("level1").setStore(new ObjectStore({ 
    objectStore: new Memory({ 
     data: getData(), 
     idProperty: 'name' 
    }) 
})); 
var getNextLevel = function(value) { 
    var data = getData(this.store.objectStore.get(value).value); 
    if (this.nextLevel) { 
     if (data.length > 0) { 
      domStyle.set(registry.byId(this.nextLevel).domNode, "display", "inline-table"); 
      registry.byId(this.nextLevel).setStore(new ObjectStore({ 
       objectStore: new Memory({ 
        data: data, 
        idProperty: 'name' 
       }) 
      })); 
     } else { 
      domStyle.set(registry.byId(this.nextLevel).domNode, "display", "none"); 
     } 
    } 
}; 
registry.byId("level1").on("change", getNextLevel); 
registry.byId("level2").on("change", getNextLevel); 

這種意志，檢索數據（使用功能更早）當值的變化，它會再填充該數據的下一級的商店。

雖然這不是一個完整的解決方案。因爲你仍然需要做一些初始化，但是它讓你瞭解如何處理這種情況。

舉例：http://jsfiddle.net/ekoronra/