Question

我正在尝试使用两个单独的ajax调用来填充两个表。以下是我的代码。

var payload = "authUserName=admin&authPassword=admin";

$.ajax({
  url: "https://appserver.dev.cloud.wso2.com/t/madusanka/webapps/projecttracker-default-SNAPSHOT/services/projecttracker/userservice/user/1/projects",
  type: "POST",
  async: false,
  dataType: "json",
  data: payload,
  complete: function(data) {
    alert("complete " + JSON.stringify(data));

//            for(var i = 1; i<= data.projects.project.length; i++){
//                  var tableRow = "<tr><td>" + data.projects.project[i].projectName + "</td><td>" + data.projects.project[i].startDate + "</td><td>" + data.projects.project[i].endDate + "</td><td>" + data.projects.project[i].statusId + "</td><td>" + "delete"  + "</td></tr>";
//                  $("#projectListTable tbody:last").append(tableRow);
//         }

  }
}).then(function(data) {

    alert("started");

    var payload2 = "authUserName=admin&authPassword=admin";

    $.ajax({
      url: "https://appserver.dev.cloud.wso2.com/t/madusanka/webapps/projecttracker-default-SNAPSHOT/services/projecttracker/userservice/user/1/projects",
      type: "POST",
      async: false,
      dataType: "json",
      data: payload2
    }).then(function(data) {
        alert("ended");
        for(var i = 1; i<= data.projects.project.length; i++){
          var tableRow = "<tr><td>" + data.projects.project[i].projectName + "</td><td>" + data.projects.project[i].startDate + "</td><td>" + data.projects.project[i].endDate + "</td><td>" + data.projects.project[i].statusId + "</td><td>" + "delete"  + "</td></tr>";
          $("#userTable tbody:last").append(tableRow);
        }
     });                        
 });

如果我在代码上面运行它会很好地执行并执行“then”中的任何函数。

当我取消注释评论的for循环时，它将不会执行超过for循环。填充项目列表后，它只是停止执行。因此“then”函数不会被执行。似乎只有一个表数据填充循环可以存在。

我希望使用ajax一个接一个地填充两个表。我真的很困惑。有人能指出我正确的方向吗？

Answer 1

为什么需要同时拥有complete和then回调函数？看看你的代码，他们似乎没有做任何不同的事情。您也可以像这样合并它们：

var payload = "authUserName=admin&authPassword=admin";
$.ajax({
  url: "https://appserver.dev.cloud.wso2.com/t/madusanka/webapps/projecttracker-default-SNAPSHOT/services/projecttracker/userservice/user/1/projects",
  type: "POST",      
  dataType: "json",
  data: payload,
  complete: function(data) {
    alert("complete " + JSON.stringify(data));

    for(var i = 1; i<= data.projects.project.length; i++){
      var tableRow = "<tr><td>" + data.projects.project[i].projectName + "</td><td>" + data.projects.project[i].startDate + "</td><td>" + data.projects.project[i].endDate + "</td><td>" + data.projects.project[i].statusId + "</td><td>" + "delete"  + "</td></tr>";
      $("#projectListTable tbody:last").append(tableRow);
      $("#userTable tbody:last").append(tableRow);
    }
  }
});

使用两个ajax调用在两个html表中填充数据

1 个答案: