使用Knockout.js的绑定问题？

Question

api using Knockout.js. I want to bind dropdownlist dynamically.Here the code i used for knockout

function LeadModel() {

        var that = this;
        that.Saleslist = ko.observableArray("") //Sales list is my model



    }

    function SalesEmpNm() {

        var that = this;
        that.LeadModel = new LeadModel();
        that.reset = function () {

            that.LeadModel.Salesid("");
            that.LeadModel.SalesNme("");
        };
        that.submit = function () {

            var json1 = ko.toJSON(that.LeadModel);
            $.ajax({
                url: '/api/values',
                type: 'GET',
                dataType: 'json',
                data: json1,
                contentType: 'application/json; charset=utf-8',
                success: function (data) {
                    var message = data.Message;
                }
            });
        };
    };
    var _vm = new SalesEmpNm();
    $(function () {
        ko.applyBindings(_vm);
    });

Here my text

Sales Name:

<select id="ddlSales" name="ddlSales" 
        data-bind="options:$root.LeadModel.Saleslist, Value:'Salesid', 
          Text:'SalesNme', Value:LeadModel.Salesid">
            </select>

Pleas suggest me the answer for binding dropdownlist dynamically. Thanks & Regards

Answer 1

i can't see where you are populating your Saleslist array. However, following should work in your case:

<select id="ddlSales" name="ddlSales"
data-bind='optionsCaption: "[Please Select]", options: _vm.LeadModel.Saleslist(), optionsText: "SalesNme", optionsValue: "Salesid"'></select>

Note that I am binding the array like _vm.LeadModel.Saleslist()

another issue in your models is LeadModel does not have Salesid and SalesNme attributes which you are accessing in reset function:

that.reset = function () {
    that.LeadModel.Salesid("");
    that.LeadModel.SalesNme("");
};

Answer 2

The issue might be you're initializing your ko.observableArray("") with an empty string "" , which isn't supported. You might just need to change it to ko.observableArray() .

But as @Ahsan said, there might be other issues in your pasted code, such as the undefined Salesid and SalesNme , and your success handler doesn't populate the Saleslist as I would've expected.

Answer 3

Perhaps the issue is because you aren't providing any values in your Saleslist .

This would solve that issue:

this.Saleslist = ko.observableArray([
    { Salesid: 1, SalesNme: "One" },
    { Salesid: 2, SalesNme: "Two" }
});