Jump to content

List of Classes with teachers

Recommended Posts

I'd like to display a simple list of classes a students is in, along with the name of their teacher. It's important to me that where a class has more than one teacher that all the teachers are named.

Looking for advice on the best way to do this.

Current thoughts....

1. Use users.getSummary.  This gives a nice list of the classes, but no uuid returned for the classes and no teacher details.

2. Use users.getDataInCategory.  Using category uuid 632EA3F52004C7F91BDF4FFCBB6D1C0B5AFBFF7CEAF86E45 returns group membership.

This time the api does return the uuid of the classes, but still no teacher details.

3. Use timetables.getTimetable.  The data returned from this api would need a lot of work to reduce down to one simple list of classes, but it's all in the return (including the teacher details).

4. There is a better api that I have missed for doing this, which somebody could tell me about!

Thanks in advance


Link to comment
Share on other sites

On 2017-5-15 at 19:59, pconkie said:

If anyone is interested, I went with option 3 above.

It displays slightly differently when staff or parents view a page with it on. This is what a student sees: 



That looks great Paul! How much was it in the end to reduce the data down?

~ Chris

Link to comment
Share on other sites

I decided to use offset = 0 and limit = 4 on the api call as this was the minimum number of weeks of timetable data i needed to loop through to ensure an accurate list is always returned for any school (it gets around everything expect the summer holidays). 

Had to write this to prevent duplicates (because they would have multiple lessons with that teachers in that subject over the next 4 weeks) 

function arrayFind(arr, fn) {
    for( var i = 0, len = arr.length; i < len; ++i ) {
        if( fn(arr[i]) ) {
            return i;
    return -1;

Found this for sorting arrays, so the list could be alphabetical by subject

function dynamicSort(property) {
    var sortOrder = 1;
    if (property[0] === "-") {
        sortOrder = -1;
        property = property.substr(1);
    return function (a,b) {
        var result = (a[property] < b[property]) ? -1 : (a[property] > b[property]) ? 1 : 0;
        return result * sortOrder;

I looped through each week, day and period, checking for duplicates, building a new json object which i then sorted and created a tbody from.

////if data contains the api response and myarr will hold the new object
var data = thisResponse.data[0];
myarr = [];

 $.each(data.weeks, function(i,weeks) {
                $.each(weeks.days, function(p,days) {
                        $.each(days.periods, function(q,periods) {
                            var x = {display: periods.teacher.displayname, subject: periods.subject, email:periods.teacher.email};
                            var result = arrayFind(myarr, function(v){
                            return v.email === periods.teacher.email && v.subject === periods.subject;
                            if (result === -1) {



Edited by pconkie
  • Like 2
Link to comment
Share on other sites

Please forgive a newbie.... not much of a coder but excited to provide helpful widgets or applications to improve student experience.  Is there a way to get the full code for this from you Paul or do I just copy the snippets from above and paste into the Frog Code as a new project?


Appreciative of any help.

Link to comment
Share on other sites

Hi @mhamilton

This was pre frog code, so it doesn't actually exist a frog code widget. You can get it working by pasting the code attached into a frog html widget. Although - it may display nothing until September depending on how your academic year is defined in your MIS.

Could be a good first frog code widget to get stuck into! You could use a preference to show or hide the email addresses for example.

The teachers email address isn't actually available in the frog api this uses, so i have cheated a little bit.  Most institutions use username@institute.com etc - hopefully this is the same for you - so change this line: var emailstem = "@backwellschool.net" to your correct stem. At the very bottom are two lines:


This widget only works for students, so you need to test by pretending you are a specific student.  You should replace the long number (a frog user id) with one of your own students and check it works. When you are ready to use the widget on your platform change this so it looks like this:


It will then display the class details of the currently logged in user.  

The full code is in the attached zip file. Good luck!


list of classes.zip

  • Thanks 1
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...