<html>
<head>
<script type="text/javascript" src="simplejax.js"></script>
<script type="text/javascript" src="record.js"></script>
<script type="text/javascript">
function displayRecord(setRecord)
{
   var display = '<b>' + setRecord.name + ' ' + setRecord.surname + '</b><br />';
   display += 'Country: ' + setRecord.country;
   
   document.getElementById('record').innerHTML = display;
}

function myCallBack(response)
{
   record.assign(response);
   displayRecord(record.activeRecord());
}

record = new record();
simplejax = new simplejax('records.json', myCallBack);
simplejax.set('JSON', true);

window.onload = function()
{
      simplejax.invoke();
}
</script>
</head>
<body>
<input type="button" value="Previous" onclick="displayRecord(record.previous())"/>&nbsp;
<input type="button" value="Next" onclick="displayRecord(record.next())" />
<div id="record"></div>
</body>
</html>