2016-08-09 3 views
0

아래 JavaScript는 목록에 항목을 추가하고 SharePoint의 그림 라이브러리에 파일을 추가합니다. add 함수는 업로드 함수를 호출하지만 업로드 함수가 완료 될 때까지 add 함수가 완료되기를 원하지 않습니다. 당연히 업로드 기능은 대부분의 시간이 더 오래 걸립니다. 이 작업을 수행하는 가장 좋은 방법은 무엇입니까?두 개의 비동기 호출 연결

추가 항목을 나열하려면 다음

function addNewPunchlistItem() { 

var endpointUrl = myURL + "PunchlistTracking/_api/web/lists/getbytitle('Punchlist Items')/items"; 

if ($('#getFile').val()) { 
    uploadFile(myFormDigest, '#getFile', $('#itemNumber').val() + "_image.png"); 
} 

call; 

var call = $.ajax({ 
    url: endpointUrl, 
    type: "POST", 
    data: JSON.stringify({ 
     "__metadata": { type: "SP.Data.Punchlist_x0020_ItemsListItem" }, 
     Title: $('#itemShortDesc').val(), 
     FSEId: $('#itemFSE').val(), 
     PunchlistNumber: $('#itemNumber').val(), 
     Open: $('#itemOpenDate').val(), 
     Type: $('#itemType').val(), 
     ResponsibleId: $('#itemResponsible').val(), 
     LongDescription: $('#itemLongDesc').val(), 
     ItemImage: { Description: "", Url: myURL + "PunchlistTracking/Lists/PicturesList/" + $('#itemNumber').val() + "_image.png" } 
    }), 
    headers: { 
     Accept: "application/json;odata=verbose", 
     "Content-Type": "application/json;odata=verbose", 
     "X-RequestDigest": myFormDigest 
    } 
}); 

call.done(function (data, textStatus, jqXHR) { 
    alert('Punchlist item ' + $('#itemNumber').val() + " added successfully."); 
    init(); 
}); 

call.fail(function (jqXHR, textStatus, errorThrown) { 
    alert('fail'); 
    var response = JSON.parse(jqXHR.responseText); 
    var message = response ? response.error.message.value : textStatus; 
    console.log(message); 
}); 
} 

파일 업로드 :이 작업을 수행하는

function uploadFile(FormDigest, FileInput, fileName) { 

var serverRelativeUrlToFolder = 'Lists/Pictures'; 
var fileInput = jQuery(FileInput); 

var serverUrl = myURL + "PunchlistTracking"; 

var getFile = getFileBuffer(); 

getFile.done(function (arrayBuffer) { 

    var addFile = addFileToFolder(arrayBuffer); 
    addFile.fail(onError); 
}); 

getFile.fail(onError); 

function getFileBuffer() { 
    var deferred = jQuery.Deferred(); 
    var reader = new FileReader(); 
    reader.onloadend = function (e) { 
     deferred.resolve(e.target.result); 
    } 
    reader.onerror = function (e) { 
     deferred.reject(e.target.error); 
    } 
    reader.readAsArrayBuffer(fileInput[0].files[0]); 
    return deferred.promise(); 
} // getFileBuffer 

function addFileToFolder(arrayBuffer) { 

    var fileCollectionEndpoint = String.format(
      "{0}/_api/web/getfolderbyserverrelativeurl('{1}')/files" + 
      "/add(overwrite=true, url='{2}')", 
      serverUrl, serverRelativeUrlToFolder, fileName); 

    return jQuery.ajax({ 
     url: fileCollectionEndpoint, 
     type: "POST", 
     data: arrayBuffer, 
     processData: false, 
     headers: { 
      "accept": "application/json;odata=verbose", 
      "X-RequestDigest": FormDigest, 
      "content-length": arrayBuffer.byteLength 
     } 
    }); 
} // addFileToFolder 

function onError(error) { 
    alert(error.responseText); 
} // onError 

} // uploadFile 
+0

당신이 사용할 수있는'promise.all()와 함께하고있는 그대로 '그들은 관련 공동되지 않고 병렬로 실행할 수 있는지. 그렇지 않다면 선행 조건 비동기 작업을 먼저 약속하고'.then'을 사용하여 두 번째 것을 첨부하고 첫 번째 해상도를 사용하십시오. – Redu

답변

0

가장 좋은 방법입니다 약속과 함께, 당신은 이미하고있는 것처럼. uploadFile 함수를 사용하여 약속을 반환하고 해당 약속의 "다음"또는 "완료"에서 두 번째 전화를 겁니다. 당신이 getFileBuffer 전화와 addFileToFolder 전화