Webmethod から返された次の JSON 文字列があります。
[{"__type":"DEV.GlobalClasses+Class","AKA":["Peter Pan","Donald Duck"],"Countries":["US","UK"],"Gender":"Male","PercentageMatch":94},{"__type":"DEV.GlobalClasses+Class,"AKA":["Andrew"],"Countries":["FR"],"Gender":null,"PercentageMatch":72}]
次のように WebPage に表示したいと思います。
AKA
Peter Pan
Donald Duck
Countries
US, UK
Gender
Male
Percentage
79
asp ListView の場合と同じように、各データ セットが表示されます。
ここまで思いついたのですが、AKA、Countries の値を取得するのに苦労しています。
$.ajax({
type: "POST",
url: "Default.aspx/PopulatePopUp",
cache: false,
data: JSON.stringify({ messageId: messageId, messageType: messageType }),
// data: '{ messageId:' + messageId + ', messageType:' + messageType + ' }',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
var classes= msg.d;
$.each(classes, function (index, class) {
var table = $("<table><thead><tr><th>AKA</th><th>Countries</th><th>Gender</th><th>Percentage</th></thead><tbody>");
var tr = "<tr>";
tr += "<td>" + joinWithBr(class["AKA"].string) + "</td>";
tr += "<td>" + joinWithBr(class["Countries"].string) + "</td>";
tr += "<td>" + class["Gender"] + "</td>";
tr += "<td>" + class["PercentageMatch"] + "</td>";
tr += "</tr>";
table.append(tr);
});
table += '</tbody></table>';
$('div#results').html(table);
}
});
function joinWithBr(arrayObj) {
var str = "";
for (var i = 0; i < arrayObj.length; i++) {
str += arrayObj[i] + "<br/>";
}
return str;
}
* 編集 *
わかりました、週末の暑さに違いありませんが、今朝は他のエラーを見つけました。彼女は以下の Jquery スクリプトを修正しました。
success: function (msg) {
var entities = msg.d;
var table = $("<table><thead><tr><th>AKA</th><th>Countries</th><th>Gender</th><th>Percentage</th></thead><tbody></tbody></table>");
$.each(entities, function (index, entity) {
var tr = "<tr>";
$.each(entity["AKA"], function (index, ele) {
tr += "<td>" + ele + "<br/>" + "</td>";
});
$.each(entity["Countries"], function (index, ele) {
tr += "<td>" + ele + "<br/>" + "</td>";
});
tr += "<td>" + entity["Gender"] + "</td>";
tr += "<td>" + entity["Percentage"] + "</td>";
tr += "</tr>";
table.append(tr);
});
$('div#results').html(table);
したがって、これは必要に応じて出力を生成するようになりましたが、レイアウトは私が望むものではなく、UI 開発者などではありません。出力を ListView に表示するにはどうすればよいですか?
*編集 *
編集 レイアウトがソートされましたが、何らかの理由で、データセットが 3 つしかない場合に 6 つのエントリを取得します。