user2433662
user2433662

Reputation:

View and ViewModel Connection

I have two files (a View and a ViewModel), but I can't figure out how to get the view to read the information stored in the model and display it. I have looked at a few related questions on this site, but haven't found anything that I have been able to get to work yet. That might just be because I don't fully understand the solutions that have been given, but I was hoping that posting this would allow someone to elaborate on a solution directly related to the project I am working on.

View File:

@{
    ViewBag.Title = "Sponsors";
}

<hgroup class="title">
    <h1>@ViewBag.Title</h1>
</hgroup>

<table>
    <thead><tr>
        <th></th><th>Sponsor</th><th>Description</th>
    </tr></thead>
    <!-- Todo: Generate table body -->
    <tbody data-bind="foreach: sponsor">
        <tr>
            <td></td>
            <td><select data-bind="text: cName"></select></td>
            <td><select data-bind="text: sDescribe"></select></td>
        </tr>
    </tbody>
</table>

ViewModel File:

    ko.applyBindings({
sponsor: [
        self.companyNames = [
            { cName: "company1", sDescribe: "company 1 been nice enough to support my bowling career by paying for a couple of my tournaments." },
            { cName: "company2", sDescribe: "I am an employee at company 2 and it is where I purchase all of my equipment. The owner has also been nice enough to supply me with a few shirts to wear in tournaments and I have even received a few bowling balls from him." }
        ]);

I have just recently begun to work with MVC frameworks so I am still learning. I've been using online tutorials to get to where I am now. This view is the 3rd one that I have worked on and is so far the only one that I cannot get to display. The others do not use a javascript page though to display their info because none of their info is dynamically loaded.

Upvotes: 0

Views: 58

Answers (1)

tabalin
tabalin

Reputation: 2313

Your view model should be valid JS object. Like following

var viewModel = {
    sponsor: [
        { cName: "company1", sDescribe: "company 1 been nice enough to support my bowling career by paying for a couple of my tournaments." },
        { cName: "company2", sDescribe: "I am an employee at company 2 and it is where I purchase all of my equipment. The owner has also been nice enough to supply me with a few shirts to wear in tournaments and I have even received a few bowling balls from him." }
    ]
};

ko.applyBindings(viewModel);

See fiddle http://jsfiddle.net/tabalinas/GHjRL/

Upvotes: 1

Related Questions