Skip to content
Assignment for Web Programming for Apps and Services class. Writing client-side JavaScript code using the MVVM pattern with Knockout.js, jQuery and Bootstrap, all running on a Node.js server. Uses a simple API consisting of collections hosted on MongoDB and published on Heroku.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.vscode
API-data-restore/dump
models
node_modules
public
README.md
data-service.js
package.json
server.js

README.md

WEB422 Assignment 3

For this assignment, we created a friendly user interface to allow users to edit existing JSON data retrieved by our API hosted on Heroku. This includes changing the Team Lead, the current Projects as well as the Members (Employees) of each of the 15 teams in the system.

Multiple Select jQuery plugin was used to make the controls much easier to use, and Knockout.js provides two-way binding for quick updates.

The collections of data are stored on MongoDB in JSON format. An AJAX "Get" request is performed with jQuery to retrieve this data through an API I've hosted on Heroku:

function initializeEmployees() {
    return new Promise((resolve, reject) => {
        $.ajax({
                url: "https://glacial-cove-51366.herokuapp.com/employees",
                type: "GET",
                contentType: "application/json"
            })
            .done(function(data) {
                viewModel.employees = ko.mapping.toJS(data);
                resolve();
            })
            .fail(function(err) {
                reject("Error loading the employee data.");
            });
    })
};

Once the GET request completes successfully, the value of the "employees" property is set to the data returned from the AJAX call using the fromJS method of the ko.mapping object. The promise is then resolved.

Contributors

Stephanie Tran, Patrick Crawford

You can’t perform that action at this time.