<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<link data-require="bootstrap@*" data-semver="3.3.5" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" />
<link data-require="bootstrap@*" data-semver="3.3.5" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" />
<script data-require="bootstrap@*" data-semver="3.3.5" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script data-require="bootstrap@*" data-semver="3.3.5" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="questionbank" ng-controller="questionbankController">
<div class="container" role="main">
<div class="row">
<div class="col-md-8">
<div class="row">
<div class="col-md-offset-2 col-md-8">
<nav>
<ul class="pager">
<li>
<a href="" ng-click="prevQ()">Previous</a>
</li>
Question {{currentQ+1}} of {{questions.length}}
<li>
<a href="" ng-click="nextQ()">Next</a>
</li>
</ul>
</nav>
<!--Display form-->
<form novalidate="">
<fieldset id="qbFieldset">
<div class="form-group">
<h4>{{questions[currentQ].question}}</h4>
<table class="table table-bordered" id="qbTable">
<tbody>
<tr ng-repeat="choice in questions[currentQ].choices">
<td width="30px">
<label for="{{choice}}">
<input type="radio" ng-model="guess[currentQ]" ng-value="choice" id="{{choice}}" name="response[{{currentQ}}]" />
</label>
</td>
<td>
<label for="{{choice}}">
{{choice}}
</label>
</td>
</tr>
</tbody>
</table>
</div>
</fieldset>
</form>
</div>
<!-- <div class="col-md-offset-2 col-md-8"> -->
</div>
<!-- <div class="row"> -->
<br />
</div>
<!-- <div class="col-md-8"> -->
<div class="col-md-4">
</div>
</div>
</div>
</body>
</html>
// Code goes here
(function() {
'use strict';
var app = angular.module('questionbank', []);
//////////////
//Directives//
//////////////
app.controller('questionbankController', ['$scope', function($scope) {
$scope.currentQ = 0;
$scope.guess = [];
$scope.SBAchoices = ['a', 'b', 'c', 'd', 'e'];
$scope.questions = questions;
$scope.prevQ = function() {
if ($scope.currentQ !== 0) {
$scope.currentQ--;
}
};
$scope.nextQ = function() {
if ($scope.currentQ < $scope.questions.length - 1) {
$scope.currentQ++;
}
};
$scope.submit = function(guess) {
};
}]);
var questions = [{
questionid: 1,
question: "What year is it?",
choices: [
"2011",
"2012",
"2013",
"2014",
"2015"
],
answer: "2015",
reason: "Because it is not yet 2016!",
category: "test"
}, {
questionid: 2,
question: "Which medical school is the best?",
choices: [
"Kings",
"Imperial",
"St. George's",
"Barts",
"UCL"
],
answer: "UCL",
reason: "Creators are from UCL, do I need to say any more?",
category: "test2"
}];
})();
/* Styles go here */