Question

I have the following simple jquery get statement that calls a WebApi on my server:

$.get('api/DataAPI?tenantId=1&datatype="Contacts"&actionname="ActiveOnly"', GetDataRetrieved);

This works fine in visual studio. I checked the network traffic in chrome and it shows the following request created:

http://localhost:61882/api/DataAPI?tenantId=1&datatype=%22Contacts%22&actionname=%22ActiveOnly%22

I have now deployed my website to IIS and the api call now fails with a 404 not found. I checked the network traffic in chrome and can see the problem:

http://localhost/api/DataAPI?tenantId=1&datatype=%22Contacts%22&actionname=%22ActiveOnly%22

Where the website when deployed to IIS is located at http://localhost/MyWebSite. So the call should go to:

http://localhost/MyWebSite/api/DataAPI?tenantId=1&datatype=%22Contacts%22&actionname=%22ActiveOnly%22

What is the correct syntax in my $.get call so that it works for both visual studio and deployed to IIS (I would love to use razor @Url.Content but that doesnt work in the javascript block)?

Thanks in advance

edit: This is the markup for the entire .cshtml page:

@{
ViewBag.Title = "MyWebSite";
Layout = "~/Views/Shared/SiteLayout.cshtml";
}

@section HeaderContent
{
<script type="text/javascript" src="@Url.Content("~/assets/scripts/App/Base64EncodeDecode.js")"></script>
 }

<script type="text/javascript">   
    $(function () {               
    $("#TestButton").click(function () {            
        $.get('api/DataAPI?tenantId=1&datatype="Contacts"&actionname="ActiveOnly"', GetDataRetrieved);
    });
});

function GetDataRetrieved(data) {        
     //alert(base64_decode(data));
    alert(data);
}   
</script>

<button id="TestButton">Test Button</button>

Answer 1

Assuming that your Javascript is located directly on the page:

$.get('@Url.Action("DataAPI", "API", new {tenantId = 1, datatype = "Contacts", actionname="ActiveOnly"})', GetDataRetrieved);

should be what you need

If it’s on another page, I like to associate the needed URL with the HTML element, and then use jQuery to extract it.

<div id='foo' data-url='@Url.Action("DataAPI", "API")'>
</div>

and then your Javascript would look like:

$.get($('#foo').data('url'), {tenantId: 1, datatype: "Contacts", actionname: "ActiveOnly"}, GetDataRetrieved);