Заполнение списка выбора с помощью ошибки JQuery

Question

У меня есть следующий код для заполнения раскрывающегося списка в форме. Кажется, что код работает, но выдает ошибку " не может прочитать идентификатор свойства undefined ".

JQuery

function LoadAnnualCredits() {
    try {
        var $dropdown = $("#creditQty");
        $dropdown.empty();
        var arrayList = [
            { "Id": 5000, "Name": "5,000" },
            { "Id": 10000, "Name": "10,000" }
        ];
        for (var i = 0; i <= arrayList.length; i++) {
            $dropdown.append($("<option />").val(arrayList[i].Id).text(arrayList[i].Name));
        }
    }
    catch (err) {
        alert(err);
    }
}

Razor View Code

@Html.DropDownListFor(m => m.NumCredits, Model.CreditQty, "Choose Qty", new { @class = "form-control", @id = "creditQty", @style = "width: 160px; height: 36px; line-height: 36px; padding: 4px;", @onchange = "CreditQtyChanged(this.value);" })

Я пытался использовать метод forEach. Нет сообщения об ошибке, но по какой-то странной причине он дает мне дублирующиеся элементы в раскрывающемся списке:

5000

5000

10000

10000

function LoadAnnualCredits() {
    try {
        var $dropdown = $("#creditQty");
        $dropdown.empty();
        let arrayList = [
            { "Id": 5000, "Name": "5,000" },
            { "Id": 10000, "Name": "10,000" }
        ];
        arrayList.forEach(function (e) {
            $dropdown.append($('<option><option/>').val(e.Id).text(e.Name));
        });
    }
    catch (err) {
        alert(err);
    }
}

Answer 1

Ваша ошибка может быть условием цикла FOR, где оно равно (i <= arrayList.length) </strong>, измените его на (i ,переменная "i" равна 0 , поэтому она не находит позицию , равную 2 , поскольку ее массив имеет только два элемента (переходит в позицию 1). Массивы в Javascript начинаются с 0, , поэтому ваш элемент позиции 2 не найден, это то, что вы делаете.Просто измените условие, и это решит проблему.