复杂的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/