Question

我正在尝试使用jQuery填充表，但是我被Ajax的异步性所困扰，并且不确定如何使用它以便按顺序发生事情。配置ID有一个主循环。对于每个循环，我执行JSON调用和预先创建的表的填充。但似乎在JSON之前完成了初始循环。

function getEntityListingsForProvisioning(oArg) {
    var user_id = oArg.user_id || parseInt(0) //zero gets nothing
    var entity = oArg.entity || "products";
    var provisioning_id_list = oArg.provisioning_id;
    var detailLinkClass = oArg.detailLinkClass || "productDetailLink"
    var retDiv = oArg.retDiv || "divResult"

    var provIdArray = provisioning_id_list.split(","); // e.g. ['39', '40']

    $("#" + retDiv).fadeIn('slow').html('');

        // create a table; we'll populate the rows later

    var x = "<table><tr>";
    for(var i=0; i<provIdArray.length; i++) {
        provid = provIdArray[i];
        x += "<td id='td_" + provid + "'>"; 
        x += "<table class='searchPod' border='0' cellspacing='0' cellpadding='2' id='tbl_" + provid + "'>";
        x += "</table></td>";
    }
    x += "</tr></table>";
    $("#" + retDiv).html(x)


    //loop through provisioning id's and get same list of products for each

    for(var j=0; j<provIdArray.length; j++) {
        var y = '';
        provisioning_id = provIdArray[j];

    // get JSON recordset. PROBLEM. I think this isn't getting finished before the main loop ticks over again.
        $.getJSON("/cfcs/main.cfc?method=getProductListings&returnformat=json&queryformat=column", {"user_id":user_id,"short":true}, function(res,code) {
            var v_listing_class = "listingCaption";
            var v_object_type = "ajax";
            var v_onclick = 'return hs.htmlExpand(this,{objectType:"ajax"})';
            var listings_noresults = "<div class='messageSuccess'><b>No records found!</b><br>Use the left-hand menu to add new records.<br>You can return here any time by clicking the Edit Provisioning link</div>";

            if(res && res.ROWCOUNT > 0)
            {
                for(var k=0; k<res.ROWCOUNT; k++)  
                {                   
                    y += "<tr>"
                    y += "<td style='width:10px' valign='middle'><input type='button' value='Use' class='btnSelProduct' id='" + provisioning_id + "^" + res.DATA.RECORD_ID[k] + "^" + entity + "^" + "'></td>"
                    y += "<td style='width:70px' valign='middle'>"
                    y += "<img id='img_" + res.DATA.RECORD_ID[k] + "' src='http://localhost/chinabuy-new/images/website/users/products/images/" + res.DATA.USER_ID[k] + "/" + res.DATA.RECORD_ID[k] + "/" + res.DATA.IMAGE1[k] + "' width='58' height='40'>&nbsp;&nbsp;&nbsp;" 
                    y += "</td>"
                    y += "<td>"
                    y += "<span class='listingText'>" + res.DATA.PRODUCT_NAME[k] + "</span>&nbsp;&nbsp;&nbsp;"
                    y += "<span class='listingText'>" + res.DATA.MODEL_NUMBER[k] + "</span>"
                    y += "</td></tr>"
                    $("#tbl_" + provisioning_id).html(y);
                }
            }
        })
    }

}

Answer 1

您需要使用callback

您可以在How can I get this function to return value retrieved using jQuery.ajax?

中看到有关回调相关问题的有效解决方案

但你必须从那个

操纵你的解决方案

我还建议您收集所需的所有ID，然后在您的情况下执行单个ajax请求。每个ajax调用都会发出一个http请求，从而产生多个延迟。

jquery json填充表

1 个答案: