How to pass parameter from Ajax Request to Web API Controller?

Question

I am looking for the way to pass the parameter from Ajax Request to Web API Controller in ASP.Net Core like query string in classic ASP. I have tried below but it did not worked.

View:

"ajax":
    {
        "url": "/api/APIDirectory/[email protected]"
        "type": "POST",
        "dataType": "JSON"
    },

Controller:

[HttpPost]
public IActionResult GetDirectoryInfo(string reqPath)
{   
    string requestPath = reqPath;
    // some code here..
}

Can anyone please advise the ways available to achieve this in asp.net core web api?

make sure @ViewBag.Title is not empty.

Farhan Ghumra
– Farhan Ghumra

2017-02-23 06:07:20 +00:00
Commented Feb 23, 2017 at 6:07 — Farhan Ghumra
– Farhan Ghumra, Commented Feb 23, 2017 at 6:07

Nagarajan Sampath · Accepted Answer · 2017-02-23 12:37:04Z

1

"ajax":
{
    "url": "/api/APIDirectory/GetDirectoryInfo"
    "type": "POST",
    "dataType": "JSON",
    "data": {"reqPath":"@ViewBag.Title"}
}

Edited: If we use query string, we can use the type as GET.

But we are using POST method, so we need to pass the data with the param "data".

edited Feb 23, 2017 at 12:37

answered Feb 23, 2017 at 6:31

Nagarajan Sampath

263 bronze badges

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

2 Comments

Nahuel Ianni Over a year ago

While this code snippet may solve the question, including an explanation really helps to improve the quality of your post. Remember that you are answering the question for readers in the future, and those people might not know the reasons for your code suggestion.

Nagarajan Sampath Over a year ago

Thank you. I have added the explanation.

Marcus Höglund · Accepted Answer · 2017-02-23 06:27:06Z

When posting data in query string use the content type application/x-www-form-urlencoded

$.ajax({
  type: "POST",
  url: "/api/APIDirectory/GetDirectoryInfo?reqPath=" + @ViewBag.Title,
  contentType: "application/x-www-form-urlencoded"
});

Also, make sure that the ajax syntax is correct (I use jQuery in my example) and that the @ViewBag is not included in the string.

Then add the [FromUri] parameter in the controller to make sure the binding reads from the uri

[HttpPost]
public IActionResult GetDirectoryInfo([FromUri]string reqPath)
{   
    string requestPath = reqPath;
    // some code here..
}

Rashmi Ranjan Ransingh · Accepted Answer · 2023-08-27 14:59:55Z

I did few things to call an API(server) from AJAX call(Client) Here is my code The API controller action:

[Route("Create")] //POST
    [HttpPost]
        public ActionResult Create(string StudentName, int age, string Address)
        {
            try
            {
                 //Your code here
                return Ok(new { Message = "Record Added" });
            }
            catch (Exception ef)
            {

                return BadRequest(ef.Message);
            }
        }

The Client ajax call:

function SaveData() {
                debugger;
                var n = $('#StudentName').val();
                var a = parseInt($('#age').val());
                var ad = $('#Address').val();
                $.ajax({
                    type: 'POST',
                    url: 'http://localhost:5128/api/Students/Create?StudentName='+n+'&age='+a+'&Address='+ad,
                    contentType: 'json',
                    //data: { studentName: n, age:a , address:ad},
                    success: function (response) {
                        if (response.length == 0) {
                            alert(response);
                        } else {
                            alert("Data Saved!");
                            };
                        },
                    error: function (err) {
                        console.error(err);
                    }
               });
            }

Collectives™ on Stack Overflow

How to pass parameter from Ajax Request to Web API Controller?

3 Answers 3

2 Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Linked

Related