jQuery Course Debug
by dandiebolt
HTML
<script src="https://github.com/jquery/jquery-tmpl/raw/master/jquery.tmpl.min.js"></script>
<script src="https://www.quickbase.com/db/bfx7sqpm8?a=dbpage&pagename=CourseInfo.js"></script>
<script id="studentTemplate" type="text/x-jquery-tmpl">
<tr>
<td><a href="mailto:${Email}">${LName + ", " + FName}</a></td>
<td>${PartnerNames}</td>
</tr>
</script>
<div id="mydiv">
<table>
<caption>Students and their Partners</caption>
<thead>
<tr>
<th>Name</th>
<th>Partners</th>
</tr>
</thead>
<tbody id="studentInfo">
</tbody>
</table>
</div>
CSS
body {
font-size: 12px;
}
table, th, td {
border: 1px solid black;
}
th, td {
padding: 5px;
}
JavaScript
$.each(students,function(index,student){
if (index == 10) return false;
var partnerIds = [];
partnerIds = student.Partners.split(',');
student.PartnerNames = '';
$.each(partnerIds, function(index, id) {
var partnerName = '';
$.each(students,function(index,student){
if (student.ID == id) {
partnerName = student.FName + ' ' + student.LName;
return true;
}
});
student.PartnerNames += partnerName + ', ';
});
$("#studentTemplate").tmpl(student).appendTo("#studentInfo");
});
$("tr:odd").css("background-color", "#F7F9BC");