JSFiddle - React, Tailwind, and code Playground

by Evan Sharp

HTML

<div ng-app ng-controller="myCtrl">
    <form name="editForm" ng-init="reset()" ng-submit="submitForm()">
        <div>First Name:
            <input ng-model="edit.firstName" />
        </div>
        <div>Last Name:
            <input ng-model="edit.lastName" />
        </div>
        <div>Email:
            <input ng-model="edit.email" />
        </div>
        <div>
            <input type="button" ng-click="reset()" value="reset" />
            <input type="submit" value="Save" />
        </div>
    </form>
</div>

JavaScript

function myCtrl($scope) {
    $scope.user = {
        firstName: "John",
        lastName: "Smith",
        email: "[email protected]"
    };
    $scope.reset = function () {
        $scope.edit = angular.copy($scope.user);
    };
    $scope.submitForm = function () {
        console.log(findDiff($scope.user, $scope.edit));
        // do w/e to save, then update the user to match the edit
        $scope.user = angular.copy($scope.edit);
    };

    function findDiff(original, edited) {
        var diff = {}
        for (var key in original) {
            if (original[key] !== edited[key]) diff[key] = edited[key];
        }
        return diff;
    }
}