Call jquery function inside Angularjs controller

Question

I have an angularjs controller. I am calling a restful webservice.

app.controller('ordersCtrl', function($scope, $http, $filter) {

$scope.fetchOrders = function () {
    var url = "http://localhost:8080/blah/blah";
    // $http({method: 'POST', url : url})

    var data = $.param({"title": "kuldeep"});

    $http({method: 'POST',
            url: url,
            data: data,
            headers: {'Content-Type': 'application/x-www-form-urlencoded'}})
        .success(function(data) {
            console.log(data)
        });
}

I want to submit form data. So using jquery to convert object to form data. But getting the error :

$ is not defined
at Scope.$scope.fetchOrders (ordersModule.js:34)

What should I do to inject jquery inside controller. Or any alternate to make form data will be appreciated.

@Vineet Why before? The application starts after the page has been loaded. — a better oliver
– a better oliver, Commented Sep 2, 2016 at 10:45
@KuldeepYadav Why you need to use jquery in your case. If you clear your scenario I can help you much in deep — Vineet
– Vineet, Commented Sep 2, 2016 at 10:46
@Rakeschand It has nothing to do with angular.element. The OP calls $. not $(. — a better oliver
– a better oliver, Commented Sep 2, 2016 at 10:47

Jazib Bashir · Accepted Answer · 2016-09-02 10:46:52Z

1

No Need to Use Jquery param function use angular params serializer:

$httpParamSerializerJQLike Alternative $http params serializer that follows jQuery's param() method logic. The serializer will also sort the params alphabetically.

$http({
  url: myUrl,
  method: 'GET',
  params: myParams,
  paramSerializer: '$httpParamSerializerJQLike'
});


.controller(function($http, $httpParamSerializerJQLike) {
  //...

  $http({
    url: myUrl,
    method: 'POST',
    data: $httpParamSerializerJQLike(myData),
    headers: {
      'Content-Type': 'application/x-www-form-urlencoded'
    }
  });

})

OR read Angular API Doc: == Click Me > $httpParamSerializerJQLike

answered Sep 2, 2016 at 10:46

Jazib Bashir

5035 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Call jquery function inside Angularjs controller

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related