MVC How to call controller post method

Question

Hi I am pretty new to web development and am stuck on a specific scenario.

I have a Map controller with 2 methods:

public ActionResult Map1(double easting, double northing)
public ActionResult Map2(double easting, double northing)

When called they both navigate their corresponding view with whatever model is required:

return View(model);

I then have some javascript which needs to call the corresponding controller method depending on the action passed through.

I want to mark the controller methods as [HttpPost], but when I do this then use an ajax request in the javascript the call to the View gets swallowed and the page is not redirected.

Currently the only way I have got it to work is by this:

window.location.href = '/Map/' + actionVal + '?easting=' + easting + '&northing=' + northing;

But with using this I cannot set the methods as POST.

Does anyone have a better idea of how I should do this?

Answer 1

you can use this code:

//Client Side
$.ajax({
    type: "POST",
    url: '@Url.Action("FirstAjax", "AjaxTest")',
    contentType: "application/json; charset=utf-8",
    data: {id :1},
    dataType: "json",
    success: function(result) {
    alert(result);
    window.locationre=result.url;
    }
    });
//AjaxTest Controller
[HttpPost]
public ActionResult FirstAjax(string id)
{

 return Json(new {url="URL"});

}

Answer 2

Does anyone have a better idea of how I should do this?

Actually there is no need for you to have TWO different Controller actions, instead you can have only ONE. And this action is going to return a view which you want to display.

One way to make a POST is to use HTML.BeginForm() and pass Controller and Action names along with FormMethod.POST to BeginForm(). Inside the BeginForm, you can have a HTML Input Button of type Submit to make the POST call to Controller action.

Also if you want to differentiate the invocation of this controller action, I would suggest you something like this -

First construct you model like this with Type variable through which you can differentiate the operation you need to perform on data -

public class Details
{
    public string easting { get; set; }
    public string northing { get; set; }
    public string type { get; set; }
}

And let your controller action be defined like this -

[HttpPost]
public ActionResult Map(Details details)

And you can have your view define a HiddenField like this -

@model Namespace.Details

@{
    ViewBag.Title = "Title";
}

<div id="uploadCourseList">
    @using (Html.BeginForm("Action", "Controller", FormMethod.Post))
    {
        @* Other properties of Model *@
        @Html.HiddenFor(m => m.type)
        <input type="submit">
    }
</div>

Now on the view set the type, so that you can differentiate the post operation and perform necessary calculations on your data and return the view.

Answer 3

You are sending a GET request. Because you are mapping your parameters on the queryString.

If you want to use it like that you should add the [HttpGet] attribute to the action. But I'd rather recomend you to use HttpPost in your AJAX request.

Edit: since you are using POST request should be like this

$.ajax({
    type: "POST",
    url: '/Maps',
    contentType: "application/json; charset=utf-8",
    data: {easting: easting, northing: northing}, //Maps the controller params
    dataType: "json",
    success: function() { alert('Success'); }
    });