Using @Url.Action in JS-asp.net MVC

Question

I have a project that I have been creating and I publish it in the IIS, there everything is fine, I can visualize my Crystal Reports reports.

Now I have re-published the project (update in IIS), but I can not see my Crystal Reports reports that I call from js.

var url = "/ReporteIngresoVP/RPVistaPreviaIngreso";
window.open(url, "_blank");

At the time of calling it, it opens a new tab (as it should be) and shows me a 404:

When I open another report (from the controller) it shows me the correct path(everything from IIS):

As I read out there if I need to use urls that point to asp.net MVC elements from js, they should go with the @Url.Action so I am trying the following:

var url2='@Url.Action("RPVistaPreviaIngreso","CustomerReporteIngresoVP")';
window.open(url2, "_blank");

But when I navigate, I get the URL in this way:

How can I complete the route or can I go to the view/controller what I want in both case, Visual Studio and the project published using javascript?

UPDATE

I try to navigate from a click function, I never pass any url, what can I modify?

$('.vpBTN').click(function () {

        //OTHER DATA
        $.ajax({
            url: "setDatosIngreso",
            method: "POST",
            data: {
                factura: datoFactura,
                poliza: datosPoliza,
                fecha: datosFecha,
                via: datosVia,
                bruto: datosBruto,
                neto: datosNeto,
                bultos: datosBultos
            },
            async: false,
            //dataType: "json",
            success: function (respuesta) {
                var url = "IKOR/ReporteIngresoVP/RPVistaPreviaIngreso";
                window.open(url2, "_blank"); 
            }
        });
    });

Is that JS code stored in external file? Sounds like the Url.Action helper is not parsed there. Note that you cannot use Razor helpers inside external script file, you need to pass it as function parameter. — Tetsuya Yamamoto
– Tetsuya Yamamoto, Commented Feb 6, 2019 at 3:36
How you're calling the function containing window.open? Can you provide some details so that I can answer by using function parameter to pass the helper result? As mentioned before, you cannot do that unless the URL is passed as parameter first. — Tetsuya Yamamoto
– Tetsuya Yamamoto, Commented Feb 6, 2019 at 3:40
@TetsuyaYamamoto all the action starts from a click function, I do some things and when those things are finished I try to navigate to a controller / view, the last part is a ajax, I edit the question to include this — Baker1562
– Baker1562, Commented Feb 6, 2019 at 3:47
Is that AJAX call stored inside external JS too? If it's true, I suggest to move out the click trigger into Razor <script> tag and then call the function which contains AJAX together with passed URL. — Tetsuya Yamamoto
– Tetsuya Yamamoto, Commented Feb 6, 2019 at 3:55

Baker1562 · Accepted Answer · 2019-02-08 17:58:39Z

2

What I did to solve it and can help someone:

Create a div that has nothing, just with a class and data-request-url in this last I send my @Url.Action()

<div class="urlPasar" data-request-url="@Url.Action("RPVistaPreviaIngreso","ReporteIngresoVP")"></div>

In JS capture the value of the data that is in the div

var url = $('.urlPasar').data('request-url');
window.open(url, "_blank");

Works for both in Visual Studio and in a published project

answered Feb 8, 2019 at 17:58

Baker1562

3474 silver badges21 bronze badges

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

Comments

Tetsuya Yamamoto · Accepted Answer · 2019-02-06 03:52:57Z

The problem is you're using external JS file which included inside Razor view, and obviously you cannot use Razor HTML helpers to render complete URL inside JS file. You need to pass the URL as JS function parameter instead:

External JS

// create this function to redirect
function redirectToUrl(url)
{
    window.open(url, "_blank"); 
}

Razor view (<script> tag)

$('.vpBTN').click(function () {
    // other data

    $.ajax({
       url: "setDatosIngreso",
       method: "POST",
       data: {
           factura: datoFactura,
           poliza: datosPoliza,
           fecha: datosFecha,
           via: datosVia,
           bruto: datosBruto,
           neto: datosNeto,
           bultos: datosBultos
       },
       success: function (respuesta) {
           var url = '@Url.Action("RPVistaPreviaIngreso","CustomerReporteIngresoVP")';
           redirectToUrl(url); 
       }
   });
});

Collectives™ on Stack Overflow

Using @Url.Action in JS-asp.net MVC

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related