嵌套JSON子项的每个循环使用underscore.js构建课程“选择器”?

时间:2015-01-17 01:37:45

标签: javascript jquery json underscore.js

我正在尝试构建一个使用JSON的基本站点,这样可以......

basic site organization

所以我设置的是一个mysql结构表,如此......

basic sql table

其中name是按钮的初始列表,然后在选择名称后,您将根据需要获得每个连续选择,直到您提取特定的课程详细信息。希望到目前为止我是一个海峡前锋。

到目前为止我尝试了什么(它确实有效)。

所以我使用getJSON和一点点PHP ...

    function getList() {
$.getJSON(serviceURL + 'getProducts.php', function(data) {
    products = data.items; });

然后我做了一些$ .each和一些ifs和一些追加......

    $.each(products, function(index, product) {
if (product.program === '' && product.platform === '') {
$('#theList').append('<div.....' + course etc.. + ');
};
if (product.program !== '' && product.platform === '') {
something else and so on....

它的工作(大部分)但它完全糟透了。我现在有一个版本的网站,我可以点击产品并通过许多选项一直到课程列表,然后是课程详细信息。我最终不得不使用url哈希添加getJSON以获得下一级别的选择,因为我等待数据加载我必须创建疯狂的id以便在最终获取数据时追加到div所以它附加在正确的位置。就像我说的,它有效,但我知道这是错误的做法。说实话,mysql表只有110行,我可以将这一切全部硬编码比我想出来的快一两周。但我真的需要了解这一点。

是下划线。我的解决方案?

所以在我的网络旅行中,我发现了underscore.js,我试试这个......

    var Sample = _.groupBy(products, 'name');
console.log(Sample);

我得到了一个漂亮的JSON数组。

    {"Fred":[
{"name":"Fred","Type":"Red","program":"basic","platform":"windows"},
{"name":"Fred","Type":"Red","program":"basic","platform":"osx"},
{"name":"Fred","Type":"Red","program":"basic","platform":"OS X"},
{"name":"Fred","Type":"Red","program":"basic","platform":"osx"},
{"name":"Fred","Type":"Red","program":"basic","platform":"osx"},
{...

如果我在Sample.Fred上为Type或程序或平台做另一个groupBy,我会得到很好的小数组,它们具有我需要的确切数据。所以现在我已经消除了为每个级别单独执行getJSON的需要,但我知道必须有更好的方法来执行此操作。对象中的第一级是否有变量? sample.items并没有让我在任何地方和sample.objects也没有,sample.fred工作,但我将不得不写出每个名称... sample.fred,sample.Jane,等......我知道这也不对。

怎么说......

每个对象的

删除重复的孩子(假设我没有在我的初始getJSON中获得课程),然后将值附加到顺序嵌套的divs ???

现在我仍然需要做大量的groupBy和$ .each将每个选项附加到相应的div。但我必须相信有一种更好,更聪明的方式。

我希望这样做不会被本地化,但我相信这是一个基本的概念和路径,我需要在这里做一些能够过滤我的方式通过孩子获取我需要的值列表特别的项目。

我意识到有很多方法可以用PHP和其他许多方法来做到这一点我从未使用过或试过。我并不想真正想要探索PHP路线,因为我希望扩展我在javascript和jquery中的技能。

感谢任何愿意提供帮助的人。

1 个答案:

答案 0 :(得分:0)

听起来你可能会更好地参加一个完整的课程并建立关系模型。然后你可以决定什么拥有什么,这将为你提供所需的分组,以及让你轻松添加功能,让你不要试图管理一堆数组。