完成.each循环后运行的代码

时间:2017-06-02 06:11:24

标签: jquery

我尝试了很多不同的方法来做到这一点 就像下面的代码一样,我试图在.each迭代完成后运行代码。

  function test(){
    var iterate = $.each(ohrArray, function(i, val){

      var ohrID = ohrArray[i];
      var folderUrl = 'EFMSEmployeeDocumentList' + "/" + locationFolder;
      var url = _spPageContextInfo.webServerRelativeUrl + "/_api/Web/GetFolderByServerRelativeUrl('" + folderUrl + "')?$expand=Files";

      $.getJSON(url,function(data,status,xhr){

        for(var i = 0; i < data.Files.length;i++){
          modifiedDate= new Date(data.Files[i].TimeLastModified);
          if(documentTitle == ""){
            showData(ohrID ,data.Files[i].Title,data.Files[i].ServerRelativeUrl,modifiedDate);
            countItems++;
          }else{
            if(documentTitle == data.Files[i].Title)

              countItems++;
              showData(ohrID ,data.Files[i].Title,data.Files[i].ServerRelativeUrl,modifiedDate);
          }
        }
      }
    }).complete(function(){

      $('#tblCustomListData').dataTable({
        paging: true,
        searching: true,
        bDestroy: true,
        "iDisplayLength": 5,
        "lengthMenu": [5,10, 25, 50, 100]
      });
      if(countItems == 0){
        alert("No Files Exists");
        $("#divCustomListData").hide();
      }
    });
  }
});


  $.when(iterate)
  .then(function(iterate){
    if(countItems == 0){
      alert("No Files Exists");
    }
  });
}

在调试过程中,我发现在{.each完成之前.then的代码正在运行。

我们还能做些什么?

3 个答案:

答案 0 :(得分:2)

iterate应该是一个承诺。

当您传递$.when()不是Promise的内容时,默认为已经解决的内容,以便立即执行$.then()

在jQuery中使用Promise检查$.Deferred

然后,您再次检查countItems,只有在每个ajax调用响应时才会更新。所以你真正需要的是完全放弃.complete()并拥有Promise的数组.each中的每次迭代都会在数组中创建一个新的Promise,然后我们将使用$.when()来检查所有 Promise的解析时间。

function test(){
    var promises = []; //

    $.each(ohrArray, function(i, val){
      var d = $.Deferred(); // keep the reference to the promise
      promises.push(d); // push the promise into the array

      var ohrID = ohrArray[i];
      var folderUrl = 'EFMSEmployeeDocumentList' + "/" + locationFolder;
      var url = _spPageContextInfo.webServerRelativeUrl + "/_api/Web/GetFolderByServerRelativeUrl('" + folderUrl + "')?$expand=Files";

      $.getJSON(url,function(data,status,xhr){

        for(var i = 0; i < data.Files.length;i++){
          modifiedDate= new Date(data.Files[i].TimeLastModified);
          if(documentTitle == ""){
            showData(ohrID ,data.Files[i].Title,data.Files[i].ServerRelativeUrl,modifiedDate);
            countItems++;
          }else{
            if(documentTitle == data.Files[i].Title)

              countItems++;
              showData(ohrID ,data.Files[i].Title,data.Files[i].ServerRelativeUrl,modifiedDate);
          }
        } // end of for loop
        d.resolve(); // the ajax in this iteration has been resolved
      }
    });

    // $.when doesn't accept array of promises by default
    $.when.apply(this, promises).then(function(){
      // now all the promises have been resolved

      // code inside the .complete you had in your question
      $('#tblCustomListData').dataTable({
        paging: true,
        searching: true,
        bDestroy: true,
        "iDisplayLength": 5,
        "lengthMenu": [5,10, 25, 50, 100]
      });
      if(countItems == 0){
        alert("No Files Exists");
        $("#divCustomListData").hide();
      }

      iterate.resolve();
    });
  }
});


}

我可能有错误格式或错放了一些括号,因为我没有运行代码。

答案 1 :(得分:0)

我找到了dataTable here

的解决方案
$(document).ready(function() {
    $('#example').DataTable( {
        "ajax": "data/objects.txt",
        "columns": [
            { "data": "name" },
            { "data": "position" },
            { "data": "office" },
            { "data": "extn" },
            { "data": "start_date" },
            { "data": "salary" }
        ]
    } );
} );

否则我认为您应该更改API,以便为API提供folderURL的列表。
然后您不需要在.each()的每个循环中发送请求。进一步,您应该能够在dataTable回调中创建success getJSON

答案 2 :(得分:0)

你在$.each内部进行了XMLHTTPRequeat,所以我想你想在处理完所有请求时执行一些代码。这不会直接发生,因为JS本质上是异步的。

您可以保留一些计数器变量来跟踪处理的总请求数。像这样:

var iterate = $.each(ohrArray, function(i, val) {

      var url = "......";
      var counter = 0;
      $.getJSON(url, function(data, status, xhr) {

        counter++;
        /**** Rest of the code ****/

        if (counter == ohrArray.length) {
          // Execute the required code by pasting it here or calling a function.
        }

      });

    }