Ajax Call to pass the data from view to Controller

Question

How can i pass a data in textbox to controller using ajax call in C# MVC. I have got examples to pass data to the string method but i wanted to pass the data to Action Result, Can any one help me to pass the data in the textbox to my Action Result method in controller.

Answer 1

If you are familiar with the @using (Html.BeginForm("action", "controller", method)), in MVC 5 there exists @using(Ajax.BeginForm("action", "controller", method)). You can find the official documentation here.

If you want the API call to be done in the background you'll also need to install jquery ajax unobstrusive.

If you need a more concrete example, there is a similar StackOverflow question 17095443. This answer explains it better than I ever could.

Answer 2

A simple syntax of ajax call to your controller is

<input type='text' id='id1' />

$.ajax({
    type: "POST",
    url: '@Url.Action("ActionName", "ControllerName")', // 'NameController/GetNameUsingAjax'
    contentType: "application/json; charset=utf-8",
    data: { name: $('#id1').val() }, // 
    dataType: "json",
    success: function(data) { alert('Success'); },
    error: function() { alert('error'); }
});

C# code is

[HttpPost]
public ActionResult GetNameUsingAjax(string name)
{
    return Json("Ajax Success + " + name);
}