Get selected options and pass it using $http in Angularjs?

Question

I am trying to pass the selected option value calling on the function on change.

<div class="col-md-4">

  <select id="mkSelect" ng-model="formData.mk" name="mkSelect" ng-options="mk.MkIdLabel group by mk.FY for mk in mks" ng-change="update()" class="form-control">
  </select>
</div>

And in the controller:

$scope.update = function() {

  // this displays the MarketId value in the log
  console.log($scope.formData.mk.MarketId);

  $http({
      method: 'POST',
      url: 'getMailStatus.php',
      // but while trying to send to "getMailStatus.php" it says its undefined 
      data: $.param($scope.formData.mk.MarketId),
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
      }
    })
    .success(function(data) {
      console.log(data);


      if (!data.success) {
        // if not successful, bind errors to error variables

      } else {
        // if successful, bind success message to message
        $scope.message = data.message;
      }
    });

};

The console.log displays the selected id , but when I try to pass the same using $http it says undefined ($scope.formData.market.MarketID = undefined)

Can anybody point me what i am doing wrong?

Answer 1

$.param needs an object, not a simple value. http://api.jquery.com/jquery.param/

Try with this:

data: $.param({mkId: $scope.formData.mk.MarketId}),