Receive multiple param from Ajax post in ASP.Net Core Web API

ruben000...

SOLVED CLOSED ACTIVE ANSWERED
User: ruben00000
Posted: on Mar 10, 2024 11:22 PM
Forum: ASP.Net Core MVC
Answer: 1
Views: 1917
Sample Code: Download

I have a simple controller API which combine with mvc view, which i want to hit the route controller from ajax post

The problem is the route address never match when i post from ajax

maybe somebody can help me

thank u

[HttpPost]
//[ValidateAntiForgeryToken]
[Route("pin")]
public IActionResult Index(string pin, string returnUrl = "")
{
    return View();
}

function postpin() {
    var pin = $('input').map(function () {
        return this.value;
    }).get().join('');
    var res = validate();
    if (res == false) {
        return false;
    }
    //alert(pin);
    var requestreturnUrl = $("#requestreturnUrl").val();
    $.ajax({
        cache: false,
        type: 'POST',
        // beforeSend: function (xhr) {
        // xhr.setRequestHeader("X-CSRF-TOKEN",
        // $('input:hidden[name="__RequestVerificationToken"]').val());
        // },
        url: '/PIN?pin=' + pin + '',
        data: { pin: pin, returnUrl: requestreturnUrl },
        contentType: 'application/json; charset=utf-8',
        datatype: 'json',
        success: function (response) {
            alert("success");
        },
        error: function (err) {
            alert(err);
        }
    });
}

dharmend...

0 5

Reply
ANSWER
User: dharmendr
Replied: on Mar 13, 2024 10:25 AM
Report

Hi ruben00000,

Refer below sample code.

Model

public class PersonModel
{
    public string pin { get; set; }
    public string returnUrl { get; set; }
}

Controller

[ApiController]
public class AjaxAPIController : ControllerBase
{
    [Route("Pin")]
    [HttpPost]
    public IActionResult Index(PersonModel person)
    {
        return new ViewResult();
    }
}

View

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <input type="text" id="txtName" />
    <input type="button" id="btnGet" value="Get Current Time" />
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#btnGet").click(function () {
                postpin();
            });
        });

        function postpin() {
            var obj = {};
            obj.pin = $("#txtName").val();
            obj.returnUrl = "/Home/Index";

            $.ajax({
                type: "POST",
                url: "Pin",
                data: JSON.stringify(obj),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    alert("success");
                },
                failure: function (response) {
                    alert(response.responseText);
                },
                error: function (response) {
                    alert(response.responseText);
                }
            });
        }
    </script>
</body>
</html>

Screenshot

Receive multiple param from Ajax post in ASP.Net Core Web API

Company

Explore

Follow us

Contact Us