title: How to send image to server on AngularJS?
body: <p>I am trying to send image to server with some additional data. My issue is that the image is not getting saved on server where other recordings are.</p>
  
  <p>below is my <strong>.html</strong> code :</p>
  
  <pre><code>&lt;div class="widget uib_w_4 d-margins" data-uib="media/file_input" data-ver="0"&gt;
     &lt;input type="file" name="image" id="image" 
        accept="image/jpeg, image/png, image/gif" 
        ng-model="image" class="ng-pristine ng-untouched ng-valid"&gt;
  &lt;/div&gt;
  &lt;div class="widget uib_w_5 d-margins" data-uib="media/text" data-ver="0"&gt;
     &lt;div class="widget-container left-receptacle"&gt;&lt;/div&gt;
     &lt;div class="widget-container right-receptacle"&gt;&lt;/div&gt;
     &lt;div&gt;
        &lt;p&gt;Username:&lt;/p&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>JS code</strong> </p>
  
  <pre><code>&lt; script &gt;
  var app = angular.module('myApp', []);
  app.controller('customersCtrl', function($scope, $http) {
      $scope.SendData = function()
      var data = $.param({
          image: $scope.image,
          username: $scope.username,
      });
  
      var config = {
          headers: {
              'Content-Type': 'application/x-www-form-urlencoded;
                  charset = utf - 8;
                  '
          }
      }
      var param = getParameterByName('id');
      $http.post('myrurl.php', data, config)
          .success(function(data, status, headers, config) {
          window.location.href = 'view.html';
      })
          .error(function(data, status, header, config) {
          alert('Please retry');
      });
  };
  }); 
  &lt; /script&gt;
  </code></pre>
  
  <p>I tried to to print the value in PHP using print_r($_REQUEST);</p>
  
  <p>The value of image is null.</p>
  
  <p><em>How can I send my image to the server?</em></p>