0

我有两个使用 PHP 从数据库中动态填充的下拉列表。它们包含指定列的所有值，例如，一个包含 parameterType 的所有值，另一个包含 dateTimeTaken 的所有值。

当数据被过滤并且其中一些选项可能不再适用时，有什么方法可以禁用这些选项中的任何一个 - 基本上我在问是否可以在数据时更新动态填充的下拉列表，如果可以，如何能完成吗？

更新：

我的数据格式如下：

 [{"dateTimeTaken":"2013-01-01 14:05:14",
   "reading":"0.90000",
   "parameterType":"Flouride",
   "inspectionPoint_id":"2"}....

我尝试使用以下代码执行此操作 - 但没有做任何事情？

 d3.json("HistoricData.php", function(error,data) 
 {
 var filtered_data = data.filter(function(d) { return d.inspectionPoint_id == i;})  
     filtered_data.forEach(function(d) {
     d.dateTimeTaken = parseDate(d.dateTimeTaken);
     d.reading = +d.reading;
     d.parameterType = d.parameterType;
     d.inspectionPoint_id = +d.inspectionPoint_id;      
 });

 var check = d3.select("selectparameter")//select dropdown list

 check.selectAll("option").each(checkOption);//select all options

 //for any of the options that don't match the parameterType's 
 //from the filtered dataset set display to none     
 var checkOption = function (d, e) {
 if(e !== d.values(d.parameterType)){
    return d3.select(this).attr("display", "none");
}
 };

更新 2

 d3.select("#selectparameter")
    .append("select")
    .selectAll("option")
    .data(filtered_data)
    .enter().append("option")
    .text(function(d) { return d.parameterType; })

在此处输入图像描述

4

1 回答 1

1

您可以使用通常的数据绑定/更新模式（参见例如本教程）来更新您的选项。

第一次调用（当你绑定数据时）看起来像

check.selectAll("option").data(data)
     .enter().append("option")
     ...

要更新，请使用类似的东西

var newOptions = check.selectAll("option").data(filtered_data);
newOptions.enter().append("option")
          ...
newOptions.exit().attr("display", "none");
newOptions.attr("display", "block");

请注意，默认情况下 d3 通过相应数组中的索引匹配数据，在这种情况下这可能不是您想要的。您可以使用可选的第二个参数来提供函数，例如

check.selectAll("option").data(filtered_data, function(d) { return d.inspectionPoint_id; });
于 2013-03-17T16:21:31.667 回答