Knockout js unable to bind data using observableArray

Question

I am trying to display all the employees in the database and I am unable to achieve it.

My JS,

var EmployeeKoViewModel = function () {
    var self = this;
    self.EmpId = ko.observable("");
    self.Name = ko.observable("");
    self.City = ko.observable("");
    self.Employees = ko.observableArray([]);
    GetEmployees();
    function GetEmployees() {
        $.ajax({
            type: "GET",
            url: "/Employee/About",
        }).done(function (data) {

            self.Employees.push(data);


        }).error(function (ex) {
            alert("Error");
        });
    }


}
$(document).ready(function myfunction() {
    ko.applyBindings(new EmployeeKoViewModel());
})

And my View,

<form>
    <table>
        <tr>

            <td>
                <div class="FixedContainer">
                    <table data-bind="visible:  Employees().length>0" style="border: double">
                        <thead>
                            <tr>
                                <td>EmpId</td>
                                <td>Name</td>
                                <td>City</td>

                                <td></td>
                            </tr>
                        </thead>
                        <tbody data-bind="foreach:  Employees">
                            <tr>
                                <td data-bind="text: EmpId"></td>
                                <td data-bind="text: Name"></td>
                                <td data-bind="text: City"></td>

                            </tr>


                        </tbody>
                    </table>
                </div>
            </td>
        </tr>
    </table>
</form>

There is no data showing up in UI .I have checked console in browser but no errors.

Can you guide Where I am doing wrong please.

data
[
ObjectCity: "Hyderabad"
EmpId: 1Name: "Vivek"
__proto__: Object
]

self.Employees.push(data); should be self.Employees(data);, try that way. And you dont need - self.EmpId = ko.observable(""); self.Name = ko.observable(""); self.City = ko.observable(""); — ramiramilu
– ramiramilu, Commented Jun 22, 2015 at 11:09
What is the data that is returned from a call to "/Employee/About"? Can you add a sample? — krivtom
– krivtom, Commented Jun 22, 2015 at 11:09
@ramiramilu That worked. Previuosly i have taken the same Observable array but i have pushed and it worked — Vivekh
– Vivekh, Commented Jun 22, 2015 at 11:10

ramiramilu · Accepted Answer · 2015-06-22 11:11:25Z

3

self.Employees.push(data); should be self.Employees(data);

answered Jun 22, 2015 at 11:11

ramiramilu

17.2k6 gold badges51 silver badges66 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Knockout js unable to bind data using observableArray

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related