I'm sorry guys but this is making me crazy. This is something I've done before, but for some reason it doesn't work.

I have a html button that fires a js function when clicked and passes a parameter:

<button type="button" class="btn btn-default" onclick="aprobarOperacion(Operacion.value)" data-dismiss="modal">

Next, my js function:

function aprobarOperacion(numeroOperacion) {

    var serviceUrl = "/Operaciones/AutorizarOperacion";

    $.ajax({
        type: "POST",
        dataType: "json",
        url: (window.BASE_URL == null) ? serviceUrl : window.BASE_URL + serviceUrl,
        data: JSON.stringify({
            operacion: numeroOperacion
        }),
        success: function (data) {
        //some code
        },
        error: function (data) {
        //some code
        },
    });
}

The thing is, this ajax function should go to Operaciones controller, and execute an action named AutorizarOperacion which expects a parameter named operacion. The URL should be like http://localhost:port/Operaciones/AutorizarOperacion, but instead the debugger console throws the following error:

Failed to load resource: net::ERR_NAME_NOT_RESOLVED --> http://operaciones/AutorizarOperacion

I dont't why but clearly the path is missing the server part. I've tried sereral ways to write the url but they all render like that.

Thanks a lot.

I'm sorry guys but this is making me crazy. This is something I've done before, but for some reason it doesn't work.

I have a html button that fires a js function when clicked and passes a parameter:

<button type="button" class="btn btn-default" onclick="aprobarOperacion(Operacion.value)" data-dismiss="modal">

Next, my js function:

function aprobarOperacion(numeroOperacion) {

    var serviceUrl = "/Operaciones/AutorizarOperacion";

    $.ajax({
        type: "POST",
        dataType: "json",
        url: (window.BASE_URL == null) ? serviceUrl : window.BASE_URL + serviceUrl,
        data: JSON.stringify({
            operacion: numeroOperacion
        }),
        success: function (data) {
        //some code
        },
        error: function (data) {
        //some code
        },
    });
}

The thing is, this ajax function should go to Operaciones controller, and execute an action named AutorizarOperacion which expects a parameter named operacion. The URL should be like http://localhost:port/Operaciones/AutorizarOperacion, but instead the debugger console throws the following error:

Failed to load resource: net::ERR_NAME_NOT_RESOLVED --> http://operaciones/AutorizarOperacion

I dont't why but clearly the path is missing the server part. I've tried sereral ways to write the url but they all render like that.

Thanks a lot.

• javascript
• jquery
• ajax
• asp-mvc

• 3 The window has no BASE_URL property, so unless you're defining that elsewhere in your code it's not going to work. – Rory McCrossan Commented May 10, 2016 at 21:00

3 Answers 3

Well as I understand you need protocol, hostname, and port.

So you should get it like this:

var baseUrl = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port: '');

And then you can use it in your script like:

url: baseUrl + serviceUrl,

You can use document.location

That object has the properties protocol, hostname, and port

function aprobarOperacion(numeroOperacion) {
    var baseUrl = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port : '';
    var serviceUrl = "/Operaciones/AutorizarOperacion";

    $.ajax({
        type: "POST",
        dataType: "json",
        url: (window.BASE_URL == null) ? serviceUrl : window.BASE_URL + serviceUrl,
        data: JSON.stringify({
            operacion: numeroOperacion
        }),
        success: function (data) {
        //some code
        },
        error: function (data) {
        //some code
        },
    });
}

BONUS: If you happen to be using babel/es6 you can make things prettier like this, I love using template strings for concatenation.

const {protocol, hostname} = document.location;
const port = document.location.port ? `:${document.location.port}` : '';
const serviceUrl = '/Operaciones/AutorizarOperacion';
const url = `${protocol}//${hostname}${port}${serviceUrl}`;

var serviceUrl = window.location.href + "Operaciones/AutorizarOperacion";  // Raw javascript
var serviceUrl = $(location).attr('href') + "Operaciones/AutorizarOperacion";  // JQuery solution