1

我有一个要求，我从数据库查询中收到一个 HashMap 列表，并且我必须在 JSP 上显示它。

JSON 对象如下所示：

[
    {"UNIT_NM":"ATLANTA",    "UNIT_CD":"A00"},
    {"UNIT_NM":"ATLANTA CKO","UNIT_CD":"A00"},
    {"UNIT_NM":"DALLAS",     "UNIT_CD":"D00"},
    {"UNIT_NM":"DALLAS CKO", "UNIT_CD":"D00"}
]

我必须在下拉列表中显示它：

"<option value='A00'> A00  ATLANTA</option>";
"<option value='A00'> A00 ATLANTA CKO</option>";
"<option value='D00'> D00 DALLAS</option>";
"<option value='D00'> D00 DALLAS CKO</option>";

JS代码是：

$.ajax({
         url:indexContextRoot+"populateManualCsoCodes",
         type:"post",
         async:true,
         success: function(data){
         var listItems= "<option value=''>Please Select</option>";
         $.each(data, function(key, value) {
                  listItems+= "<option value='" + key + "'>" + value + "</option>";
         });
             $("#manualCsoCodes").html(listItems);
        }
    });

我得到的下拉列表为：

[object][Object]
[object][Object]
[object][Object]
[object][Object]

请有任何建议！

4

3 回答 3

3

each() 回调函数有两个参数：1）数组元素的索引，2）数组元素。所以key将是 0、1、2 等，并将value成为该索引位置的 js 对象。所以你需要这样做：

$.each(data, function(key, obj) {
      var str = obj["UNIT_CD"];
      listItems+= "<option value='" + str + "'>" + str + " " + obj["UNIT_NM"] + "</option>";
         });
于 2013-07-04T02:34:26.320 回答
2 
listItems+= "<option value='" + value.UNIT_CD + "'>" + value.UNIT_CD + " " + value.UNIT_NM + "</option>";

PS：如果你用过，你可以自己做console.log(value);

于 2013-07-04T02:35:43.983 回答
2

为了使这更加模块化并涉及更少的 HTML，这是我对此的看法：

var data = [
  {
    "UNIT_NM": "ATLANTA",
    "UNIT_CD": "A00"
  }, 
  {
    "UNIT_NM": "ATLANTA CKO",
    "UNIT_CD": "A00"
  }, 
  {
    "UNIT_NM": "DALLAS",
    "UNIT_CD": "D00"
  }, 
  {
    "UNIT_NM": "DALLAS CKO",
    "UNIT_CD": "D00"
  }
];


//init first option
var $option = $("<option/>", {
    "value": '',
    "html": "Please Select"
});

//add that to an array
var options = [$option];

//iterate over data
$.each(data, function (key, value) {
    // value now contains a row eg., when key = 0, value =  { "UNIT_NM": "ATLANTA", "UNIT_CD": "A00" }

    //clone the default option, change the value and the HTML, then push into options array
    options.push($option.clone().val(value.UNIT_CD).html(value.UNIT_CD + " " + value.UNIT_NM));
});

//add that array into select
$("#manualCsoCodes").html(options);

这个想法是创建一个options数组，其中填充带有标签名称的 jQuery 对象，option然后将其放入select标签中。这是一个演示

哦，在我忘记之前，each逐行迭代。因此，在 的任何迭代中each，您都会得到一行数据。例如，

如果key === 2, 那么value === { "UNIT_NM": "DALLAS", "UNIT_CD": "D00" }

因此，要访问UNIT_NM& UNIT_CD，您必须分别使用value.UNIT_NM& value.UNIT_CD。有关 的更多信息each，请参阅文档。

希望有帮助！

于 2013-07-04T02:55:20.037 回答