Question

尝试创建一组由Google电子表格驱动的html表单选项/选择字段，以引导用户进行特定选择。想一个有红色，蓝色或黑色的帽子，有蓝色，绿色或红色的T恤。对于许多行，源数据在col 1中具有相同的值，在col 2中具有唯一值。颜色对于每个产品是特定的。（电子表格结构无法更改。）

我正在尝试按产品分组行，因此我可以填充产品下拉列表，然后填充该产品的颜色下拉列表。那就是我被困住的地方。

我的数据加载正常，可以在表单中显示内容，只需要深入了解如何结束如何构造数组：

var productsAndColors = [];
productsAndColors[0] = new Array("hat", ["pink", "red", "blue"]);

在这里引用iffy位：

for (i = 0; i < json.feed.entry.length; i++) {
    var entry = json.feed.entry[i];
    product = entry.gsx$product.$t;
    productsAndColors[i] = ['', []];
    if (productCheck != product) {
        productsAndColors[i][0] = product;
        thisShape = product;
    }
    color = entry.gsx$color.$t;
    productsAndColors[i][1].push(color);
}

这会在每行创建一个数组，似乎无法找到一种对行进行分组的方法。我意识到这是一个塌陷的人。

感谢您的想法。

http://jsfiddle.net/hartogsmith/SqNNk/

https://docs.google.com/spreadsheet/ccc?key=0AkT3oKFSug31dGhva1lpWkhDOGxKaVJsNnpkZVpNbUE#gid=0

Answer 1

为什么没有那些严格打字的东西？

如果您习惯于将.value设置/读作字符串，从第一个下拉列表（即：“product”）开始，那么您可以拥有一个简单的对象：

var products = {
    hat : {
        colours : [ "red", "green", "blue", "black", "grey" ]
    },
    shirt : {
        colours : [ "pink", "salmon", "mauve", "chartreuse" ]
    }
};

可能更简单：

var products = {
    hat : [ "grey", "gray", "charcoal", "smoke" ],
    shirt : [/*...*/]
};

那么为什么要将“颜色”作为属性添加到每个？
仅仅因为它是一个对象的形容词，你可能想要添加更多的形容词：.size : [], .shipping_options : [], .cut : []。

shirt : {
    size : [],
    logo : [],
    cut  : []
}

你真的不希望最终成为：

products[0][1][1]
products[1][2][3]

世界。

试试这个：

var Products = {},
    product_type,
    current_value,
    color_arr;

for (...) {
    product_type  = entry.gsx$product.$t;
    current_value = entry.gsx$color.$t;

    Products[product_type] = Products[product_type] || { colors : [] };
    /* same as:
        if (!Products.hat) { Products.hat = { colors : [] }; }
        ...basically, Products.hat == itself, else a new object
    */
    color_arr = Products[product_type].colors;
    color_arr.push(current_value);

}

现在，您可以说Products.hat.colors[1]

如果您按照以下方式设置第一个下拉列表：

<select name="product">
    <option value="hat"  >Cap</option>
    <option value="shirt">Tee</option>
</select>

然后：

var type = product_select.value,
    avail_colours = Products[type].colors;

Javascript对象：基础知识差距

1 个答案: