javascript - How to dynamicly pass data to select list?

Question

I need to dynamicly pass data to my select list with jquery. I see that data in console but my list is empty. Can you help me find the solution?

<script type="text/javascript">
    var kunnr;
    $(document).ready(function () {
        $('#NAME1').autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: "Form2",
                    method: 'POST',
                    data: {
                        term: $('#NAME1').val()
                    },
                    success: function (data) {
                        response(data);
                    }
                });
            },
            select: function (event, ui) {
                kunnr = ui.item.kunnr;
                $.ajax({
                    url: "Form3",
                    method: 'POST',
                    data: {
                        kunnr: kunnr
                    },
                    success: function (data) {
                        console.log(data); 
                    //there is my data ^ i need to pass to select list

                    }
                });
            }
        });
    });
</script>

My select list

@Html.DropDownListFor(model => model.Subaccount, new SelectList(" "), new { @class = "form-control" })

Answer 1

Change your javascript code to this

var kunnr;
$(document).ready(function () {
    $('#NAME1').autocomplete({
        source: function (request, response) {
            $.ajax({
                url: "Form2",
                method: 'POST',
                data: {
                    term: $('#NAME1').val()
                },
                success: function (data) {
                    response(data);
                }
            });
        },
        select: function (event, ui) {
            kunnr = ui.item.kunnr;
            $.ajax({
                url: "Form3",
                method: 'POST',
                data: {
                    kunnr: kunnr
                },
                success: function (data) {
                    var selectData = JSON.parse(data);//use JSON.parse(), if the data is not already json formatted
                    $("#Subaccount").empty();
                    selectData.forEach(function (obj) {
                    //NOTE the Value and Text are what you assigned them when you fetched them
                        $('#Subaccount').append($('<option></option>').val(obj.Value).html(obj.Text));
                    });
                }
            });
        }
    });
});