Одна функция находится в области видимости, а другая - вне области действия, хотя обе они определены в одном и том же месте. - PullRequest
0 голосов
/ 01 апреля 2020

Обе функции вызываются из document.ready:

$(document).ready(function () {
    pnp.sp.web.lists.getByTitle("inReviewContracts").items.getAll().then (function(items) {
        spContractList = items;
        constructTable('#in-review-requests-table');
        colorTable();
        getNumVisibleContracts();
        calculateTotalCost();
        populateDashboardNumbers();
    }).catch(function(items) {
        console.log("Catch: ", items);
    });

    const dirMenuElement = document.querySelector('.dir-menu');
    dirMenuElement.addEventListener('change', (event) => {
        constructTable('#in-review-requests-table');
        filterTable("");
    });
});

Оба вызова constructTable () работают нормально. Вызов filterTable () вызывает ошибку «не функция». Обе функции определены за пределами document.ready. Ни один из них не использует указанное пространство имен. Это фактическая ошибка:

Uncaught TypeError: filterTable is not a function
at HTMLSelectElement.<anonymous> (scripts.js:49)

(аноним) @ scripts. js: 49

Снимок экрана с определениями функций:

enter image description here

Почему я могу вызвать constructTable (), но не могу вызвать filterTable ()?

Определения функций:

function constructTable(selector) {
var list = getContractsFromLocalStorage(); 
if (!list) {
    $(selector).addClass('no-data-text').html("No Data Available");
    return;
}

// Get column names 
var cols = getHeaderValues(list, selector);   

// Traverse JSON data 
for (var i = 0; i < list.length; i++) { 
    var row = $('<tr>');
    for (var colIndex = 0; colIndex < cols.length-1; colIndex++) 
    { 
        var val = list[i][cols[colIndex]];
        if (val) {
            if (colIndex !== cols.length-2) {
                switch (colIndex) {
                    case 0:
                        row.append($('<td><input type="checkbox" class="checkbox-col"></td>'))
                        row.append($('<td class="sca-number-col">').html(val + '</td></tr>'));
                        break;
                    case 1: 
                        row.append($('<td class="contract-duration-col"/>').html(val + '</td></tr>'));
                        break;
                    case 2:
                        row.append($('<td class="requested-cost-col"/>').html(val + '</td></tr>'));
                        break;
                    case 3:
                        row.append($('<td class="total-cost-col"/>').html(val + '</td></tr>'));
                        break;
                    case 4: 
                        row.append($('<td class="contract-term-col"/>').html(val + '</td></tr>'));
                        break;
                    case 5:
                        row.append($('<td class="scarb-review-col"/>').html(val + '</td></tr>'));
                        break;
                    case 6:
                        row.append($('<td class="region-scarb-review-col"/>').html(val + '</td></tr>'));
                        break;
                    case 7:
                        row.append($('<td class="status-col"/>').html(val + '</td></tr>'));
                        break;
                }
            }  else {
                $(selector).append(row); 
                $(selector).append($('<tr>' + '<td class="cont-desc-row">' + (val) + '</td>' + '</tr>'));
            }
        }
    } 
}
// use this to set the colspan attr with jquery b/c it cannot be done when building the table
$('td.cont-desc-row').attr('colspan', 9);

}

function filterTable(segName) {
var filter, activeTable, tr;
var dirFilter = document.getElementById("dir-menu").value.toUpperCase();
var officeFilter = document.getElementById("sca-menu-1").value.toUpperCase();
var activeTabID = $('.tab-link:not(.non-active-tab)').attr('id');
var activeTableID = activeTabID.replace('btn', 'table');
activeTable = document.getElementById(activeTableID);
tr = activeTable.getElementsByTagName("tr");

var yearFilter = document.getElementById("sca-menu-2").value.toUpperCase();

var filter3 = document.getElementById("sca-menu-3").value.toUpperCase();

var addFilter = document.getElementById("sca-menu-4").value.toUpperCase();

var scarbRevFilter = document.getElementById('scarb-review-menu-1').value.toUpperCase();

var contractFilter = document.getElementById('contract-term-menu-1').value.toUpperCase();

filterAll(activeTable, dirFilter, officeFilter, yearFilter, filter3, addFilter, scarbRevFilter, contractFilter, tr, segName);

colorTable(activeTable);
calculateTotalCost();
if (!segName) {
    populateDashboardNumbers();
}
getNumVisibleContracts();

}

1 Ответ

1 голос
/ 01 апреля 2020

Проблема не связана с JS. В SharePoint есть встроенная функция с именем «filterTable», которую я перезаписывал. Переименовал функцию, и код теперь работает.

...