>>>>OK - simple example. WebApiController:
using System.Collections.Generic;
>>>>using System.Web.Http;
>>>>
>>>>namespace MvcApplication1.Controllers
>>>>{
>>>> public class EquipmentController : ApiController
>>>> {
>>>> [HttpPost]
>>>> public List<Item> Items()
>>>> {
>>>> //In reality build this from the datatable
>>>> return new List<Item>
>>>> {
>>>> new Item {Company = "XYZ Inc", Id = "12345", Model = "Teleporter Mk2"},
>>>> new Item {Company = "ABC Inc", Id = "23456", Model = "Stun Gun"},
>>>> new Item {Company = "Arr Inc", Id = "23456", Model = "Warp Drive"}
>>>> };
>>>> }
>>>> }
>>>>
>>>> public class Item
>>>> {
>>>> public string Id { get; set; }
>>>> public string Company { get; set; }
>>>> public string Model { get; set; }
>>>> }
>>>>}html page:
<!DOCTYPE html>
>>>><html xmlns="http://www.w3.org/1999/xhtml" ng-app>
>>>><head>
>>>> <title></title>
>>>> <script src="scripts/angular.js"></script>
>>>> <script src="Scripts/jquery-1.8.2.js"></script>
>>>></head>
>>>> <body>
>>>> <form data-ng-controller="EquipCtrl">
>>>> <input id="loadBtn" type="button" value="Load Data" data-ng-click="LoadData()" />
>>>> <table>
>>>> <tr>
>>>> <th>Id</th>
>>>> <th>Company</th>
>>>> <th>Model</th>
>>>> </tr>
>>>> <tr ng-repeat="item in EquipmentList" data-ng-click="showrow(item)">
>>>> <td>{{item.Id}}</td>
>>>> <td>{{item.Company}}</td>
>>>> <td>{{item.Model}}</td>
>>>> </tr>
>>>> </table>
>>>> <p>
>>>> <input id="Text1" type="text" data-ng-model="currentItem.Id" />
>>>> <input id="Text2" type="text" data-ng-model="currentItem.Company" />
>>>> <input id="Text3" type="text" data-ng-model="currentItem.Model" />
>>>> </p>
>>>> </form>
>>>> </body>
>>>>
>>>><script type="text/javascript">
>>>> function EquipCtrl($scope, $http) {
>>>>
>>>> $scope.currentItem = null; //currently selected item
>>>> $scope.EquipmentList = []; //list of items
>>>>
>>>> //async call to the webapi:
>>>> $scope.LoadData = function () {
>>>> $http.post('/api/Equipment/items')
>>>> .success(function (data, status, headers, config) {
>>>> $scope.EquipmentList = data;
>>>> });
>>>> };
>>>>
>>>> //Change current item when row is clicked
>>>> $scope.showrow = function (item) {
>>>> $scope.currentItem = item;
>>>> };
>>>> }
>>>></script>
>>>></html>Not pretty since I've not applied any styling. If you want to try it just add the controller to a new MVC/WebApi project Controllers folder. Make sure you have angular.js in the scripts section. Note how the table contents change when editing one of the textboxes....
>>>
>>>Thank you very much for the sample code. I will review and see if it applies to my project.
>>
>>As it stands I'm sure it won't. But should give an idea of the approach.....
>
>I am sure that sooner or later your idea will come in handy. I have changed my design approach about 100 times; each time learning something new. This project (ASP.NET) has been blessing (even though it takes tons and tons of hours) as it revived my interest in programming again. It has been a while since I stayed after work watching course(s) in Pluralsight and Googling for articles instead of reading a novel.
The databinding with either Knockout/Durandel ( knockout is the binding tech and Durandel the "framework" that uses it) or Angular as Viv shows in his example is definitely the way to go.
The other piece is Breeze which handles some of the stuff you really don't want to have to make yourself crazy about ( new parent, new child, identity keys assigned on back end ) and has some wonderful query tricks for getting your data and not chewing up the wire with more data than you need.
Yesterday John Papa released his new course on using Angular and Breeze with a WebAPI. It is stunningly good and I think shows how much that stack is maturing. You could use just that course and be up and running faster than you could figure all this stuff out in older technologies. John has even created some "Hot-Towel" nuget packages to load up everything you need.
I loved John's SPA course using Knockout / Durandal in the same way but I think this is even better.
I've been doing this for 30 years now and have even done a bit of teaching and creating course material and this particular course is probably the best I have seen.
I cannot imagine tackling these new technologies without this kind of training.
Charles Hankey
Though a good deal is too strange to be believed, nothing is too strange to have happened.
- Thomas Hardy
Half the harm that is done in this world is due to people who want to feel important. They don't mean to do harm-- but the harm does not interest them. Or they do not see it, or they justify it because they are absorbed in the endless struggle to think well of themselves.
-- T. S. Eliot
Democracy is two wolves and a sheep voting on what to have for lunch.
Liberty is a well-armed sheep contesting the vote.
- Ben Franklin
Pardon him, Theodotus. He is a barbarian, and thinks that the customs of his tribe and island are the laws of nature.
