使用从ajax响应创建的变量填充表

Question

I have a table that is populated with data that I then need to use to run a second query. I am using jquery datatables and those are the functions that you see that allow me to grab all the content from the table. So for example I am grabbing an integer out of the fourth column like this and then using that number to run a query for a json response :

var cells = [];
var rows = oTable.fnGetNodes();
for( var i=0;i<rows.length;i++)
        {
            var grabsku = $j(rows[i]).find('td:eq(3)').text();
            grabsku = grabsku.substring(0, 6) + "-0" + grabsku.substring(7, grabsku.length - 4);
            s7url = 'http://jsonquery.com/' + grabsku  + '?req=exists,json';        

      $j.ajax({
        url: s7url,
        dataType: 'jsonp'
        });
       }

THen with that ajax request the json returns either a 1 or 0 which I can then form the correct info depending on what is returned.

function s7jsonResponse(response)
        {
        var s7img = sku;
        s7img = '<img src="http://imageserver.com/is/image/' + s7img.substring(0, 6) + "-0" + s7img.substring(7, s7img.length - 4) + '">';
         x = response["catalogRecord.exists"];  
             z = x == "0" ? "NO IMG" : s7img;
             console.log(z);
        }

Console now shows me what I want for z variable, either an image path or NO IMG. My problem is getting this out of console and actually back into the table. What I want to happen is as each response comes in to replace a td in the table with the z variable. I tried to put this in the jsonResponse but it did not work correctly. How could I iterate through the table, in this case (td:eq(2)) and replace each cell with the variable z I get back from this query?

Answer 1

Need to create a function to do the ajax that you can pass the row index and the url that contains data query string to as arguments. Since you know the cell index , once data returned from ajax you can call fnUpdate for using new data and row index within success of the ajax

var cells = [];
var rows = oTable.fnGetNodes();
for (var i = 0; i < rows.length; i++) {
    var grabsku = $j(rows[i]).find('td:eq(3)').text();
    grabsku = grabsku.substring(0, 6) + "-0" + grabsku.substring(7, grabsku.length - 4);
    s7url = 'http://jsonquery.com/' + grabsku + '?req=exists,json';
    var rowIndex = i;
    doAjax(s7url, rowIndex)
}



function doAjax(url, rowIndex) {
    $j.ajax({
        url: s7url,
        dataType: 'jsonp',
        success: function(repsonse) {

            var s7img = sku;
            s7img = '<img src="http://imageserver.com/is/image/' + s7img.substring(0, 6) + "-0" + s7img.substring(7, s7img.length - 4) + '">';
            x = response["catalogRecord.exists"];
            z = x == "0" ? "NO IMG" : s7img;
            console.log(z);
        /* do fnUpdate here using new data and rowIndex and you know the cell index already*/
        }



    });
}