Как мне заполнить выпадающий список List <string>, используя knockout.JS

Question

Я играю с knockoutJS и изо всех сил пытаюсь получить раскрывающийся список с данными из моей модели.

Полагаю, мне нужно сначала преобразовать данные модели в JSON, но пока я не могу это понять.

У меня есть базовый класс:

public class QuoteViewModel
{
    public QuoteViewModel()
    {
        QuoteLines = new List<QuoteLine>();
    }

    public int QuoteHeaderId { get; set; }

    public string QuoteNumber { get; set; }
    public string Status { get; set; }
    public DateTime DateCreated { get; set; }

    [DisplayName("Customer")]
    public SalesCustomer SelectedCustomer { get; set; }
    public List<string> Customers { get; set; }
    public List<QuoteLine> QuoteLines { get; set; }    
}

У меня есть ActionMethod в контроллере:

[HttpGet]
public ActionResult CreateQuote()
{
    QuoteViewModel quote = new QuoteViewModel();
    quote.QuoteNumber = "";
    quote.Status = "P";
    quote.Customers = _dbContext.SalesCustomers.Select(x => x.CustomerName).ToList();
    quote.QuoteLines = new List<QuoteLine>();

     return View(quote);
}

И просмотр ():

Razor:

<select class="form-control" id="SelectedCustomer" data-bind="options: availableCustomers, optionsText: 'CustomerName', value: SelectedCustomer, optionsCaption: 'Choose...'"></select>

ViewModel:

function QuoteViewModel() {
    var self = this;

    self.Id = ko.observable('@Model.QuoteHeaderId');
    self.QuoteNumber = ko.observable();
    self.Status = ko.observable('@Model.Status');
    self.DateCreated = ko.observable();

    self.availableCustomers = JSON.parse('@Html.Raw(Model.Customers)');


    @*$.ajax({
        type: "GET",
        url: '@Url.Action("GetCustomers", "Test")',

        success: function (data) {
            $.each(data, function (index, value) {
                self.availableCustomers.push(new Customer(value));
            });
        },
        error: function (err) {
            console.log(err.responseText);
        }
    });*@
    self.SelectedCustomer = ko.observable();

    self.QuoteLines = ko.observableArray([]);

    self.AddQuoteLine = function (sku, description, bomDetails) {
        self.QuoteLines.push(new QuoteLineViewModel(sku, description, bomDetails));
    }

    self.SaveToDatabase = function () {
        var dataToSend = ko.mapping.toJSON(self);
        $.ajax({
            type: "POST",
            url: '@Url.Action("CreateQuote", "Test")',
            contentType: 'application/json',
            data: dataToSend,
            success: function (data) {
            },
            error: function (err) {
                console.log(err.responseText);
            }
        });
    }

Закомментированный код использует ajax, чтобы получить клиентов и поместить его в массив, и это работает, но нет ли способа сделать это непосредственно из данных модели?

Редактировать 1:

Мне не нужен доступ ко всему объекту SalesCustomer, просто имя строки:

Если я изменю свой код следующим образом:

Контроллер:

 quote.Customers = _dbContext.SalesCustomers.Select(x => x.CustomerName.Trim()).ToList();

Свойство класса модели:

 public List<string> Customers { get; set; }

Razor:

<select class="form-control" id="SelectedCustomer" data-bind="options: availableCustomers, value: SelectedCustomer, optionsCaption: 'Choose...'"></select>

Javascript:

 self.availableCustomers = ko.observableArray([]);
 var customers = '@Html.Raw(JsonConvert.SerializeObject(Model.Customers))';
 self.availableCustomers = JSON.parse(customers);
 self.SelectedCustomer = ko.observable();

Теперь раскрывающийся список заполняется строковыми значениями имен клиентов. Однако выбранный клиент не передается обратно в контроллер по POST?

Редактировать 2:

Ну, я не уверен, почему это работает сейчас, но это так.

Код такой же, как в Edit 1.

Единственное, о чем я могу думать, это то, что у меня по ошибке был установлен тип свойства SelectedCustomer, равный SalesCustomer, который, очевидно, не будет работать:

public SalesCustomer SelectedCustomer { get; set; }

когда это должно быть:

public string SelectedCustomer { get; set; }

Спасибо, user3297291, за помощь, указав мне правильное направление.