CODEWITHSUNDEEP
c#ajaxasp.net-mvc
LosDichtos
LosDichtos

Reputation: 15

C# & ASP.NET MVC : call a view with ajax call

I want to call a view with an ajax call on my current view. The following is my Ajax call that calls a function of my controller.

$.ajax({
    type: 'POST',
    url: '@Url.Action("EditCertificateObservation", "Frühwarnsystem")',
    data: {
        serverName: '@Model[0].ServerName',
        name: event.data.name,
        thumbprint: event.data.thumbprint,
        expiringDateStr: event.data.expiringDate,
        isChecked: document.getElementById(store + event.data.index).checked,
        model: data,
    },
});

This code is my controller function that returns a view to load.

[HttpPost]
public ActionResult EditCertificateObservation(string serverName, string name, string thumbprint, string expiringDateStr, bool isChecked, string model)
{
    var newModel = JsonConvert.DeserializeObject<List<Store>>(model);

    var cert = new Certificate(serverName, name, thumbprint, expiringDateStr);
    var server = new Server(serverName);
    server.FetchIdByServerName();

    if (isChecked)
    {
        cert.AddToObservation(server.Id);
    }
    else
    {
        cert.DeleteFromObservation();
    }

    return View("Index");
}

To know for you: I call the ajax call with a checkbox on my view, which is dynamically generated. If I debug the controller function get called and runs but the browser doesn't load the view I return.

If you need more information, just ask here.

Thank you for your help

Upvotes: 1

Views: 3685

Answers (2)

B.S.
B.S.

Reputation: 678

If you want to open a view with after Ajax request than you just have to wait for the response of your controller then you can use success, but you can also use failure or error depend on your need, so your Ajax will be like this:

$.ajax({
    type: 'POST',
    url: '@Url.Action("EditCertificateObservation", "Frühwarnsystem")',
    data: {
        serverName: '@Model[0].ServerName',
        name: event.data.name,
        thumbprint: event.data.thumbprint,

        expiringDateStr: event.data.expiringDate,
        isChecked: document.getElementById(store + event.data.index).checked,
        model: data,
    },
        success: function (response) { 
        alert(response.message); 
        window.location.href = "/Frühwarnsystem/Index";

        // or with some parameter
        window.location.href ="/Frühwarnsystem/Index?id=" + response.counter;

        // or if you prefer with helper ...
        window.location.href = '@Url.Action("Frühwarnsystem","Index")';
        
        },
        failure: function (response) { alert("failure"); },
        error: function (response) { alert("error"); }
});

And to be a little more useful, your controller can send a Json response with some parameter for example, as follow:

[HttpPost]
public JsonResult EditCertificateObservation(string serverName, string name, string thumbprint, string expiringDateStr, bool isChecked, string model)
{
    var newModel = JsonConvert.DeserializeObject<List<Store>>(model);

    var cert = new Certificate(serverName, name, thumbprint, expiringDateStr);
    var server = new Server(serverName);
    server.FetchIdByServerName();

    if (isChecked)
    {
        cert.AddToObservation(server.Id);
    }
    else
    {
        cert.DeleteFromObservation();
    }
    // Do some condition here to send an answer ...
    string message = "";
    int counter = 0;
    var response = new { counter, message };
    return Json(response);
}

Upvotes: 1

Martin Staufcik
Martin Staufcik

Reputation: 9490

You are calling an ajax POST HTTP request. It means you can download the result of the call and assign it into a javascript variable. This result will not be displayed in the browser as a page. Take a look at examples of $.post here.

Upvotes: 1

Related Questions