Im using a $.getJson to retrieve json objects into my viewmodel and applybindings. It will not display the databindings in the foreach come what may. [code] - index.cshtml
@{
ViewData["Title"] = "Home Page";
}
@section Scripts {
<script>
require(['knockout', 'jquery', 'bootstrap', 'components/clients-list.component'], function (ko) {
ko.applyBindings();
});
</script>
}
<!DOCTYPE html>
<head>
<title>Index</title>
</head>
<body>
<div class="text-center">
<h1 class="display-4">Welcome</h1>
<p>Machine Grid</p>
<div>
<table>
<tbody data-bind="foreach: machines">
<tr style="border-bottom: 1px solid #000000;">
<td>
<span data-bind="text: machineid"></span>
</td>
<td>
<span data-bind="text: ports"></span>
</td>
<td>
<span data-bind="value: Weight"></span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div>
</div>
</body>
<script type="text/javascript">
var AppViewModel = function () {
var self = this;
self.machines = ko.mapping.fromJS([]);
$.getJSON('/Home/Index/', function (data) {
self.machines = ko.mapping.fromJS(data);
});
};
$(document).ready(function () {
var viewModel = new AppViewModel();
ko.applyBindings(viewModel);
});
</script>
//Models.MachineModel
public class MachineModel
{
public int MachineId { get; set; }
public string HardDrive { get; set; }
public string Ports { get; set; }
public string GraphicsCard { get; set; }
public string Weight { get; set; }
public string Power { get; set; }
public string Processor { get; set; }
public string Ram { get; set; }
}
//Controller
public async Task<IActionResult> Index()
{
IEnumerable<MachineModel> machineList;
using (var httpClient = new HttpClient())
{
using (var response = await httpClient.GetAsync("https://localhost:44336/api/Machine"))
{
string apiResponse = await response.Content.ReadAsStringAsync();
machineList = JsonConvert.DeserializeObject<IEnumerable<MachineModel>>(apiResponse);
}
}
return View(machineList);
}
There is a a populated object I have checked when debugging. I have also tried using Json(machineList) but that comes up with a dialog box to download json and then terminates.
public async Task Index() {