TypeError: Cannot read property 'jquery' of undefined
angularjs, javascript, jquery
Solution
`$scope.formData.imageFile` seems to evaluate to `undefined`.
$.param(undefined) //throws Cannot read property 'jquery' of undefined
Do a `console.log($scope.formData)` right before the `$http()` call. The `$scope.formData` object most likely does not contain an `imageFile` property, or `imageFile` is `null`/`undefined`.
Note that `$.param` takes a plain object or array as the first argument, providing another type of value (or no value) falls under undefined behavior.
Also, if I'm reading your code correctly, you're trying to upload an image file through `$http`. It won't work that way, you need XHR2's `FormData` API. See this answer for a simple implementation.
Angular does not support `ng-model` on `<input type="file">`, which is the reason for the former error.
Problem
I'm getting the following error in Chrome console, ``` TypeError: Cannot read property 'jquery' of undefined ``` Here is my javascript function, ``` <script type="text/javascript"> var formApp = angular.module('formApp',[]); function formController($scope,$http){ $scope.formData = {}; $scope.processForm = function(){ $http({ method : 'POST', url : 'http://localhost:8080/ABCAPI/v1/image/front', data : $.param($scope.formData.imageFile), headers : {'Content-Type': "multipart/form-data" , 'Auth-Token' : "X"} }).success(function(data){ console.log(""); if (!data.success) { // if not successful, bind errors to error variables } else { // if successful, bind success message to message $scope.message = data.message; } }) }; } </script> ``` What does above error means and where did I go wrong?