MVC Routing Issue with Javascript function

Question

I have a MVC Application where I'm using a lot of function on javascript and I have a separate file (that's why I cant use URL helpers) for those javascript call msa.js and it is in the folder Scripts I referenced on my mvc View like this: <script type="text/javascript" src="~/Scripts/msa.js"></script> The reference work fine, but the problem is in the javascript file: I have a lot of calls to server methods using ajax that's why I have to use the property "url" many times on the ajax call. The problem is that on my local computer it's work fine and the url is structure like this:

http://localhost:59655/WorkPanel/GetListOfPermissons

And it is correct!! But when I want to upload the application for the server I have to use a Virtual Directory that's why the url change for:

http://10.10.25.161/MSA/WorkPanel/

When I Execute the application on the server mvc try to put the url like this:

http://10.10.25.161/WorkPanel/GetListOfPermissons

And there is the problem don't execute the function because the directory MSA is missing from the url: this is an example of my code javascript:

$.ajax({
    type: "POST",
    url:  '/WorkPanel/GetListOfPermissons',
    data: {},
    contentType: "application/json; charset=utf-8",
    dataType: "json",

Any body had faced this problem?? How did you solved this. Thank you in advanced... Jose

score 0 · Answer 1 · answered Apr 10 '15 at 12:00

0

A good solution is to work with a global variable where you would stance the virtual directory:

var dir = "/WorkPanel"

And you ajax calls would be:

$.ajax({
    type: "POST",
    url:  dir + "/GetListOfPermissons',
    data: {},
    contentType: "application/json; charset=utf-8",
    dataType: "json",
});

When ou want to use the other dir, just change in the file. Hope it helps, thanks!

answered Apr 10 '15 at 12:00

netrevisanto

1,091
12
13

You could use too, a function to check the server environment, testing the host ip, and validation like this: if (window.location.host == "your.app.production.domain.com") dir = "/MSA" else dir = "/WorkPanel" – netrevisanto Apr 10 '15 at 12:02
Thank you very much for your answer, but in that case I should have the virtual directory in hard code and in that case WorkPanel isn't a directory it is a controller, the directory should be dynamically, I probably don't know what will be the name for the Directory folder... Thanks again – Apr 10 '15 at 12:07

score 0 · Answer 2 · edited May 23 '17 at 12:03

0

You can use razor helper to render your base url to to a global variable in _Layout.cshtml or some page that will use the url as in this answer.

<script type="text/javascript">
    var baseUrl = '@Url.Content("~")';
</script>

And in your js file you do this:

$.ajax({
    type: "POST",
    url:  baseUrl + '/WorkPanel/GetListOfPermissons',
    data: {},
    contentType: "application/json; charset=utf-8",
    dataType: "json",

Just remember to reference your file after the global variable already declared.

edited May 23 '17 at 12:03

Community

1
1

answered Apr 10 '15 at 12:12

rtbortolin

93
2
5

Thank you very much but this not a possibility because the javascript function it is in a separate file the you can't do it because the server interpret that like a string... Thanks – Apr 10 '15 at 12:13
Sorry, i didn't realize this. You can use @netrevisanto solution but using window.location – rtbortolin Apr 10 '15 at 12:19

score 0 · Answer 3 · edited Sep 10 '15 at 06:16

Thank every body for the help but I don't think that it is possible to find a solution like a property or method, that's why I coding my own javascript function and solved the problem, maybe is not the best solution but at least don't use hard code into the functions... Here is my function maybe someone could use it:

function GetUrlAjaxCall(action, controller) {
    var urlmedia = window.location.toString();
    var urlSplit = urlmedia.split('/');
    var url = "";
    if (urlSplit.length == 7)
        url = urlSplit[0].trim() + '//' + urlSplit[2].trim() + '/' + urlSplit[3].trim() + "/" + controller + "/" + action;
    else
        url = urlSplit[0].trim() + '//' + urlSplit[2].trim() + "/" + controller + "/" + action;
    return url;
}

MVC Routing Issue with Javascript function

3 Answers3