Использование jQuery deferreds не откладывает выполнение функции - PullRequest
Новая
       19

Использование jQuery deferreds не откладывает выполнение функции

0 голосов
/ 30 мая 2019

В настоящее время я застрял в интерфейсе плагина, который пишу. Я пытаюсь отложить выполнение функции фильтра для элементов строки таблицы HTML (hide (), show ()) и маркеров на листовой карте до тех пор, пока они не будут созданы, но Firefox всегда выдает мне ошибку

TypeError: job.tableRow не определен

Если я закомментирую создание таблицы строк, я получу точно такую ​​же проблему с маркерами на листовой карте.

Я много читал об отложенных объектах jQuery и пробовал 2 или три способа их реализации, но, похоже, я все еще упускаю что-то важное.

Что работает: Я могу успешно отфильтровать задания, которые отображаются / скрываются в списке и на карте вручную после полной загрузки страницы.

Однако, если я пытаюсь выполнить некоторую начальную фильтрацию, я получаю ошибку. Похоже, что функция фильтрации выполняется до создания tableRow.

Итак, мой текущий код выглядит так: 

//inside the "main" function

if(jobs != null){
    /* this code works
       createMarkers(jobs);   
       createJobTable(jobs, tableBody);
    */
    //but like this it does not
    $.when( createMarkers(jobs), createJobTable(jobs, tableBody)).done(filterJobs);


function filterJobs(){

    ...

    //go through array of jobs and hide markers and list entry of those, with status that is not checked
    for (i = 0, max = jobs.length ; i < max; i++){
        job = jobs[i];
        if (shownJobStatus.includes (job['status']) ){
            job.tableRow.show();
            job.marker.addTo(jobmap);
        }
        else {
            job.tableRow.hide();
            job.marker.remove();
        }
    }
}

function createMarkers(jobs){

    jQuery(function($){
        var deferred = $.Deferred();

        for (i = 0; i < jobs.length; i++){

            //extract lat, lon, ... from job, I leave out again
            job.marker = L.marker([lat, lon], {icon: markerIcon}).addTo(jobmap);
            job.marker.bindPopup(jobName).openPopup();
        }

        deferred.resolve();
        return deferred;
    })
}


function createJobTable(jobs, tableBody){

    jQuery(function($){

    let promiseArray = [];

    for (i = 0; i < jobs.length; i++){
        job = jobs[i];
        promiseArray.push( createJobTableEntry(job, tableBody) );
    }
    deferred.resolve();
    return Promise.all(promiseArray); 

    })
}

function createJobTableEntry(job, tableBody){

    jQuery (function($){

        let defer = $.Deferred();

        const jobId = job['id'];

        job.tableRow = $("<tr></tr>");
        tableBody.append(job.tableRow);

        //put lots of stuff in the table like this
        job.tableRow.append($("<td></td>").text(job.jobName));

        //lots of user-role dependant stuff 

        defer.resolve();
        return defer.promise();

    })
}

Я думал, что линия 

$.when( createMarkers(jobs), createJobTable(jobs, tableBody)).done(filterJobs);

должен выполнять filterJobs () только после разрешения отложенного возврата createMarkers и createJobTable. Отложенное должно быть разрешено только после того, как все элементы были созданы. Так почему же это не работает?

...