<!DOCTYPE html>
<html>

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.css" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.js"></script>
</head>

<body ng-app ="login">
<div ng-controller="loginCtrl">
  <div ng-include="partialUrl"></div>

</div>


</body>

</html>
// Code goes here

angular.module("login", [])

.controller("loginCtrl", ['$scope', '$http', 'login', function($scope, $http, login) {
  $scope.partialUrl = "login.html"
  $scope.user = {};
  $scope.doLogin = function(user) {
    //do networking stuff here
    login(user.name)
    console.log("user logged in:  " + user.name)
  };
  $scope.goToRegistration = function() {
    $scope.partialUrl = "register.html"
    $scope.newUser = {};
  };
  $scope.registerUser = function(user) {
    //do networking stuff here
    console.log("registered: " + user.name)
  };
}])

.factory('login', ['$http', function($http) {
  var auth = [];
  
  return function(auth) {
    var user = {
      "username" : $("#username").val(),
      "password" : $("#password").val()
      
    }
    console.log(user);
    $http.post('http://thecurtisplace.com/startuppredictions/public_html/php/login.php', {
      userName: user.username,
      password: user.password
    }).
    then(function(response) {
      // this callback will be called asynchronously
      // when the response is available
    }, function(response) {
      // called asynchronously if an error occurs
      // or server returns response with an error status.
    });
  };
}]);
/* Styles go here */

.floatItRight{
  float:right;
}
<div class="panel panel-primary">
  <div class="panel-heading text-lg">Log in!
    <small class="floatItRight">
        <button class="btn btn-warning" ng-click="goToRegistration()">Register</button> 
  </small>
  </div>
  <div class="panel-body">
    <form novalidate class="form-group">
      Username:
      <input type="text" id= "username" class=" form-control" ng-model="user.name" />
      <br /> Password:
      <input type="password" id="password" class=" form-control" ng-model="user.pwd" />
      <br />
      <input class="login btn btn-primary" type="submit" ng-click="doLogin(user)" value="Log Me In!" />
    </form>

  </div>
</div>
<div class="panel panel-primary">
  <div class="panel-heading text-lg">Register!
  
  </div>
  <div class="panel-body">
    <form novalidate class="form-group row container-fluid ">
      First Name:
       <input type="text" class="form-control" ng-model="newUser.fName" />
       Last Name:
       <input type="text" class="form-control " ng-model="newUser.lName" />
      Username:
      <input type="text" class="form-control" ng-model="newUser.name" />
      <br /> Password:
      <input type="password" class="form-control" ng-model="newUser.pwd" />
      <br />
      <input class="login btn btn-primary" type="submit" ng-click="registerUser(newUser)" value="Register Me!" />
    </form>
  
  </div>
</div>
<?php
$mysqli = new mysqli("mysql.thecurtisplace.com", "mimescd", "Eu565uo9!", "world");

/* check connection */
if (mysqli_connect_errno()) {
    printf("Connect failed: %s\n", mysqli_connect_error());
    exit();
}

$city = "Amersfoort";

/* create a prepared statement */
if ($stmt = $mysqli->prepare("SELECT District FROM City WHERE Name=?")) {

    /* bind parameters for markers */
    $stmt->bind_param("s", $city);

    /* execute query */
    $stmt->execute();

    /* bind result variables */
    $stmt->bind_result($district);

    /* fetch value */
    $stmt->fetch();

    printf("%s is in district %s\n", $city, $district);

    /* close statement */
    $stmt->close();
}

/* close connection */
$mysqli->close();
?>