Render json in table using AngularJs
HTML
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://code.angularjs.org/1.0.1/angular-1.0.1.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/2.3.2/css/bootstrap.min.css" rel="stylesheet">
<div ng-app="myApp">
<div ng-controller="FormCtrl">
<div>
<div ng-repeat="section in sections" class="well" style='overflow: hidden'>
<h5>{{section.name}}</h5>
<div ng-repeat="formfield in section.fields | filter:q">
<div ng-switch on="formfield.Field.fieldType">
<div ng-switch-when="Txt" class="span{{formfield.spanSize}}" style="margin-left: 5px; ">
<label for="" class="label label-info">{{formfield.Field.label}}</label>
<input type="text" class="input-block-level" section="{{formfield.section}}" name="" id="test">
</div>
<div ng-switch-when="Are" style="margin-left: 5px; ">
<br>
<div>
<label for="" class="label label-info">{{formfield.Field.label}}</label>
<textarea class="input-block-level" name="" section="{{formfield.section}}" id="test"></textarea>
</div>
</div>
<h1 ng-switch-default>Error</h1>
</div>
</div>
</div>
</div>
</div>
</div>
JavaScript
var mockDataForThisTest = "json=" + encodeURI(JSON.stringify({
"formId": 0,
"docType": "CPS CIS Committee Review notes",
"startQueue": "CPS CIS Committee Review Sort",
"drawer": "CPS-Admissions",
"title": "CPS CIS Committee Review notes",
"FormsFields": [{
"fieldId": 0,
"formId": 0,
"id": 0,
"sequence": 0,
"spanSize": 2,
"tableNumber": 0,
"rowNumber": 0,
"style": null,
"section": "Student Demographics",
"editable": true,
"required": true,
"custom": null,
"regEx": null,
"script": null,
"value": null,
"programabilityId": null,
"Field": {
"fieldId": 0,
"fieldType": "Txt",
"label": "Regis Id",
"description": "Regis Id",
"FieldsOptions": [],
"FormsFields": []
},
"Programability": null
}, {
"fieldId": 1,
"formId": 0,
"id": 1,
"sequence": 1,
"spanSize": 5,
"tableNumber": 0,
"rowNumber": 0,
"style": null,
"section": "Student Demographics",
"editable": true,
"required": true,
"custom": null,
"regEx": null,
"script": null,
"value": null,
"programabilityId": null,
"Field": {
"fieldId": 1,
"fieldType": "Txt",
"label": "Last Name",
"description": "Last Name",
"FieldsOptions": [],
"FormsFields": []
},
"Programability": null
}, {
"fieldId": 2,
"formId": 0,
"id": 2,
"sequence": 2,
"spanSize": 4,
"tableNumber": 0,
"rowNumber": 0,
...