AngularJS Example

by leighboone

HTML

<div ng-app="">
    <div ng-init="features = [{
		  	     		" id ":"accces ",
		  	     		"name ":"508 ",
		  	     		"sort ":1,
		  	     		"question ":"Does your product need to be 508 compliant? ",
		  	     		"EPUB ":"yes ",
		  	     		"PDF ":"yes ",
		  	     		"Replica ":"no ",
		  	     		"App ":"no ",
		  	     		"HTML5 ":"yes ",
		  	     		"checked ":false
		  	     	},
		  	     	{
		  	     		"id ":"reflow ",
		  	     		"name ":"Reflowable Text ",
		  	     		"sort ":2,
		  	     		"question ":"Does your need to have reflowable text? ",
		  	     		"EPUB ":"yes ",
		  	     		"PDF ":"yes ",
		  	     		"Replica ":"partially ",
		  	     		"App ":"no ",
		  	     		"HTML5 ":"yes ",
		  	     		"checked ":false
		  	     	},
		  	     	{
		  	     		"id ":"audio ",
		  	     		"name ":"Audio ",
		  	     		"sort ":3,
		  	     		"question ":"Does your product use audio files? ",
		  	     		"EPUB ":"yes ",
		  	     		"PDF ":"yes ",
		  	     		"Replica ":"yes ",
		  	     		"App ":"yes ",
		  	     		"HTML5 ":"yes ",
		  	     		"checked ":false
		  	     	},
		  	     	{
		  	     		"id ":"video ",
		  	     		"name ":"Video ",
		  	     		"sort ":4,
		  	     		"question ":"Does your product use video files? ",
		  	     		"EPUB ":"partially ",
		  	     		"PDF ":"yes ",
		  	     		"Replica ":"yes ",
		  	     		"App ":"yes ",
		  	     		"HTML5 ":"yes ",
		  	     		"checked ":false
		  	     	},
		  	     	{
		  	     		"id ":"markers ",
		  	     		"name ":"Video Markers ",
		  	     		"question ":"Does your product use video markers or links to specific time frames? ",
		  	     		"sort ":5,
		  	     		"EPUB ":"no ",
		  	     		"PDF ":"yes ",
		  	     		"Replica ":"no ",
		  	     		"App ":"no ",
		  	     		"HTML5 ":"yes ",
		  	     		"checked ":false
		  	     	}]"></div>
    <table id="searchTextResults">
        <tr>
            <th>Name</th>
            <th>Phone</th>
        </tr>
        <tr ng-repeat="friend in friends |...

CSS

</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> <script src="http://code.angularjs.org/1.1.5/angular.min.js"></script> <style> ​.ng-invalid {
    border: 1px solid red;
}
​