Jon Sambo

Jon Sambo

  • NA
  • 38
  • 4.8k

why doesn't my application display values using knockout

Feb 23 2016 3:53 AM
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title - Member manager</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/knockout")
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
@RenderSection("scripts", required: false)
</head>
<body>
<div class="container-narrow">
<div class="masthead">
<ul class="nav nav-pills pull-right"></ul>
<h3 class="muted">ANC Member Manager</h3>
</div>
<div id="body" class="container">
<script src="~/Scripts/knockout-3.4.0.js"></script>
@RenderSection("featured", required: false)
<section>
@RenderBody()
</section>
</div>
<hr />
<div id="footer">
<div class="container">
<p class="muted credit">&copy; @DateTime.Now.Year - Designed and developed by <a href="http://www.solveteque.co.za">John B Sambo</a>.</p>
</div>
</div>
</div>
</body>
</html>
** Index.cshtml**
@{
ViewBag.Title = "Index";
}
<h2>Contact Index</h2>
<table class="table table‐striped table‐bordered table‐condensed">
<tr>
<th>Title</th>
<th>First Name</th>
<th>Last Name</th>
<th>ID Number</th>
<th>GP Number</th>
<th>Email</th>
</tr>
<tbody data‐bind="foreach: Profiles">
<tr>
<td data‐bind="value: Title"></td>
<td data‐bind="text: FirstName"></td>
<td data‐bind="text: LastName"></td>
<td data‐bind="text: IdNumber"></td>
<td data‐bind="text: GpNumber"></td>
<td data‐bind="text: Email"></td>
</tr>
</tbody>
</table>
<script src="~/Scripts/member.js"></script>
**member.js**
var DummyProfile = [
{
"ProfileId": 1,
"Title": "Mr.",
"FirstName": "John B",
"LastName": "Sambo",
"IdNumber": "4812215562087",
"GpNumber": "GP00010000011",
"Email": "[email protected]"
},
{
"ProfileId": 2,
"Title": "Pastor",
"FirstName": "Wanka",
"LastName": "Mogale",
"IdNumber": "4812200062087",
"GpNumber": "GP04940000011",
"Email": "[email protected]"
}
]
var ProfilesViewModel = function () {
var self = this;
var refresh = function () {
self.Profiles(DummyProfile);
};
// Public data properties
self.Profiles = ko.observableArray([]);
refresh();
};
ko.applyBindings(new ProfilesViewModel());

Answers (1)