title: AngularJS $http.post(..) - Error: $http is not defined
body: <p>I'm trying out AngularJS for the first time. When using the <code>$http.post("url", data)</code> function, I'm getting a <code>Error: $http is not defined</code> console message.</p>
  
  <p>At the top of my HTML page I am including AngularJS after all other JS imports.</p>
  
  <p>I have also included other JavaScript libraries due to widget dependencies etc. My script imports section looks like this:</p>
  
  <pre><code>&lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="http://www.trirand.com/blog/jqgrid/js/i18n/grid.locale-en.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="http://www.trirand.com/blog/jqgrid/js/jquery.jqGrid.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"&gt;&lt;/script&gt;
  
  &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>I have a controller which I'm using to send some data to the server:</p>
  
  <pre><code>function FormCtrl($scope) {
    $scope.sendData = function(){
          var data = "firstName=" + $scope.firstName + "&amp;" +
              "lastName=" + $scope.lastName + "&amp;" +
              "address=" + $scope.address + "&amp;" +
              "postcode=" + $scope.postcode;
  
          $http.post("/data/person/put", data);
       };
  }
  </code></pre>
  
  <p>The <code>sendData</code> function is attached to a button. All works fine until the call to <code>$http.post(...)</code> at which point the console outputs the error. </p>
  
  <p>The full error listing is:</p>
  
  <pre><code>Error: $http is not defined
  $scope.sendData@http://localhost:8080/angularjs/:96
  Mc/x/&lt;@https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js:71
  ec[c]&lt;/&lt;/&lt;/&lt;@https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js:142
  e.prototype.$eval@https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js:87
  e.prototype.$apply@https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js:87
  ec[c]&lt;/&lt;/&lt;@https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js:142
  c.event.handle@http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js:63
  c.event.add/o@http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js:57
  
  https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js
  Line 61
  </code></pre>
  
  <p>Do I have to do something else to configure AngularJS to use the <code>$http.post</code> function?</p>
  
  <p>I lifted the usage straight from the AngularJS <strong>Shortcut Methods</strong> section of the documentation here: <a href="http://docs.angularjs.org/api/ng.$http" rel="noreferrer">http://docs.angularjs.org/api/ng.$http</a></p>
  
  <p>Can anyone help?</p>
  
  <p>Thanks 
  Adam</p>