How to call a method from API Controller using ajax

Question

I want to call a method from API Controller using AJAX. I have tried the following

I have added one hidden field in the view (like what we are doing in mvc controller)

<input type="hidden" id="GetShoppingCartUrl" value="@Html.Action("GetShoppingCartUrl","Cart")"/>

Then I have written ajax

function GetShoppingCart() {
            debugger;
            var url = $('#GetShoppingCartUrl').val();
            $.ajax({
                type: "get",
                url: url,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                },
                error: function () {
                }
            });
        }

But here it is not getting the method, GetShoppingCartUrl from the API Controller CartController. I want to call that method, what changes make it happening ?

Answer 1

 function GetShoppingCart() {
                debugger;
                var url = "Cart/GetShoppingCartUrl"
                $.ajax({
                    type: "get",
                    url: url,
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                    },
                    error: function () {
                    }
                });
            }

you can directly put your actionlink in the url Hope it helps. :)

Answer 2

Use this below code to get the url of your site in javascript and append it before the url in ajax call. e.g var url = baseUrl+ "Cart/GetShoppingCartUrl";

@{ string url = Request.Url.GetLeftPart(UriPartial.Authority) + Request.ApplicationPath; if(url[url.Length-1]!='/') { url =url+ "/"; } } var baseUrl = '@url'; //alert(baseUrl);