从JSON数组中设置选择选项

时间:2014-10-20 02:23:22

标签: javascript jquery json

我从JQUERY getJSON调用返回以下JSON:

{                               
"status": "Succes",             
"type": "GPS",                  
"serial": "40332",              
"crat": "C3",                   
"ata": "34",                    
"time": "0",                    
"dates": ["30/09/14","01/10/14"]
}  

我想迭代日期并设置一个带有日期值的选择下拉列表。

我很高兴在标准JavaScript或JQuery中执行此操作。

我尝试了很多选项,但似乎都没有。

该页面包含以下代码部分:

<select name="adddate">
  <option value="---">--- Select A Date ---</option>
</select>

在我的getJSON成功函数的javascript中,这是我尝试过的最新代码。

var strDates = data.dates;       
var arrayDates = new Array();    
arrayDates = strDates.split(",");

我尝试了其他方法,但没有一种方法有效,我现在已将它们删除了。

我有一些代码可以将其他输入设置为JSON数据中的其他项目并且正在运行。

它只是提取日期数组并添加每个项目作为我无法弄清楚的选项的选项。

1 个答案:

答案 0 :(得分:0)

这应该这样做:

var select = $('select[name=adddate]');
$.each( data.dates, function(i, date) {
  select.append( $('<option/>',{text:date}) );
});

var data = {                               
"status": "Succes",             
"type": "GPS",                  
"serial": "40332",              
"crat": "C3",                   
"ata": "34",                    
"time": "0",                    
"dates": ["30/09/14","01/10/14"]
},
    select = $('select[name=adddate]');
$.each( data.dates, function(i, date) {
  select.append( $('<option/>',{text:date}) );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="adddate">
</select>