0

我试图从 json 数据中获取值以在表中显示详细信息。我有两个json对象，如下所示。我必须通过从第一个json对象传递jobid来从secong json对象中获取名称和脚本。一切正常。 

var recent= [{
    "jobid": "4",
    "browser": "FF20",       
    "names": "abc@gmail.com",
    "datetime": "Thu Oct 03 2013 13:41:06 GMT+0530 (IST)",
    "_id": "524d269a6d32804512000001"
}, {
    "jobid": "34",
    "browser": "GC23",       
    "names": "abc@gmail.com",
    "datetime": "Thu Oct 03 2013 13:41:47 GMT+0530 (IST)",
    "_id": "524d26c36d32804512000002"
}, {
    "jobid": "34",
    "browser": "IE8",       
    "names": "abc@gmail.com",
    "datetime": "Thu Oct 03 2013 13:41:50 GMT+0530 (IST)",
    "_id": "524d26c66d32804512000003"
}, {
    "jobid": "34",
    "browser": "FF20",       
    "names": "abc@gmail.com",
    "datetime": "Thu Oct 03 2013 13:41:53 GMT+0530 (IST)",
    "_id": "524d26c96d32804512000004"
}, {
    "jobid": "34",
    "browser": "GC23",      
    "names": "abc@gmail.com",
    "datetime": "Thu Oct 03 2013 13:41:55 GMT+0530 (IST)",
    "_id": "524d26cb6d32804512000005"
}]

第二个 josn 对象

var data = {
    "_id": ObjectId("524507068d8f5f6eee8bc602"),
    "id": "86",
    "names": "jhkujiyo",
    "script": "art-pagination"
} {
    "_id": ObjectId("524508788d8f5f6eee8bc605"),
    "id": "79",
    "names": "koiuo",
    "script": "panini-main-flow"
} {
    "_id": ObjectId("52450a0f8d8f5f6eee8bc606"),
    "id": "34",
    "names": "ioiuo",
    "script": "panini-silk-flow"
} {
    "_id": ObjectId("524a4f4cc973602da0d4ee10"),
    "id": "4",
    "names": "tuesdat val",
    "script": "art-pagination"
}

但是我的问题是只有当我发出警报时才获取表格数据，例如：alert(k)或类似的东西。没有任何警报我testname and testscript的表格列出现undefined

var name=[],script=[];
function recentTests() {

        var k = 0;
    $('#recentTest').html('');
    var recentlist = "<table class='tablestyle'><tr><th class='thstyle' >Browser</th><th class='thstyle' >Test Name</th><th class='thstyle' >TestScript</th><th class='thstyle' >User</th><th class='thstyle' >Date</th></tr>";

    //   alert("Recent-----------"+JSON.stringify(recent));    
    recent.forEach(function (result) {

        var params = {
            "id": result.jobid
        };

        $.get('/getJobs', params, function (data) {
            **alert("data-----------" + JSON.stringify(data));// the above json data object is getting from db...so i staticly put** 
            data.forEach(function (value) {
                script.push(value.script);
                name.push(value.names);
            });

        });

        alert(k)
        recentlist += '<tr><td class="tdstyle">' + result.browser + '</td><td class="tdstyle">' + script[k] + '</td><td class="tdstyle">' + name[k] + '</td><td class="tdstyle">' + result.names + '</td><td class="tdstyle">' + result.datetime + '</td>'
        k++;
    });

    recentlist += '</table>';
    $('#recentTest').html(recentlist);
}

另外，我的第一个 json 包含重复的 jobid $.get('/getJobs', params, function (data) {...所谓的多次。如何避免？ http://jsfiddle.net/GXVpa/3/

4

1 回答 1

1

正是由于 ajax 请求的异步特性，任何处理 ajax 响应数据的代码都需要添加到成功回调中

var name = [],
    script = [];

function recentTests() {

    var recentlist = $("<table class='tablestyle'><tr><th class='thstyle' >Browser</th><th class='thstyle' >Test Name</th><th class='thstyle' >TestScript</th><th class='thstyle' >User</th><th class='thstyle' >Date</th></tr></table>");

    //   alert("Recent-----------"+JSON.stringify(recent));    
    recent.forEach(function (result) {

        var params = {
            "id": result.jobid
        };

        $.get('/getJobs', params, function (data) {
            data.forEach(function (value) {
                script.push(value.script);
                name.push(value.names);
                recentlist.append('<tr><td class="tdstyle">' + result.browser + '</td><td class="tdstyle">' + value.script + '</td><td class="tdstyle">' + value.names + '</td><td class="tdstyle">' + result.names + '</td><td class="tdstyle">' + result.datetime + '</td>')
            });

        });
    });

    $('#recentTest').empty().append(recentlist);
}

更多详情：阅读本文

更新

function recentTests() {
    var jobMap = {};

    var recentlist = $("<table class='tablestyle'><tr><th class='thstyle' >Browser</th><th class='thstyle' >Test Name</th><th class='thstyle' >TestScript</th><th class='thstyle' >User</th><th class='thstyle' >Date</th></tr></table>");

    //   alert("Recent-----------"+JSON.stringify(recent));    
    recent.forEach(function (result) {
        if (jobMap[result.jobid]) {
            return;
        }

        var params = {
            "id": result.jobid
        };

        jobMap[result.jobid] = true;
        $.get('/getJobs', params, function (data) {
            data.forEach(function (value) {
                recentlist.append('<tr><td class="tdstyle">' + result.browser + '</td><td class="tdstyle">' + value.script + '</td><td class="tdstyle">' + value.names + '</td><td class="tdstyle">' + result.names + '</td><td class="tdstyle">' + result.datetime + '</td>')
            });
        });
    });

    $('#recentTest').empty().append(recentlist);
}
于 2013-10-04T04:15:22.960 回答