How to make GET Ajax call to Asp.Net Core Mvc controller

Question

I am new to MVC, and I am working on a homework project where I need to make ajax call to a controller so I can select data from the database. When I make the ajax call I get 200 HTTP code but the I can't print what's in the success: in the ajax parameters. If anyone knows the solution to this, please help me. Thank you in advance

MVC controller

[HttpGet]
public JsonResult GetPasos(string pasos)
{
    var patnici =  _context.Patnici
        .FirstOrDefaultAsync(m => m.PassporNo == pasos);

    return new JsonResult(patnici);
}

Ajax call:

$(document).ready(function () {
    $("input#PassporNo").on("input", function () {
        var input = document.getElementById("PassporNo").value;
        var regex = new RegExp("^[A-Z0-9]+$");

        if (regex.test(input) && input.length === 8) {
            //$("input#PassporNo").on("input", function () {
            console.log("blabla")
            $.ajax({
                //base address/controller/Action
                url: '/Patnicis/GetPasos/',
                type: 'GET',                 
                data: 
                    //Passing Input parameter
                    {"pasos": $('input#PassporNo').val() }
                ,                   
                success: function (result) {
                    console.log("Rabote ajax");
                },
                error: function (jqXHR, textStatus, errorThrown, data) {
                    alert(jqXHR.status);
                    alert(textStatus);
                    alert(errorThrown);
                    console.log(data)
                }
            });
            return false;
        }
    });
});

You are not doing anything with `result`, like console.log(result); — Stefan, Nov 03 '20 at 18:07
Does this answer your question? [jQuery: Return data after ajax call success](https://stackoverflow.com/questions/5316697/jquery-return-data-after-ajax-call-success) — Stefan, Nov 03 '20 at 18:08

Serge · Answer 1 · 2020-11-03T19:32:49.573

0

Change your controller action attribute [GET] to [Route("~/Patnicis/GetPasos/{pasos}")]

And try this:

(document).ready(function () {
        $("input#PassporNo").on("input", function () {
            var input = document.getElementById("PassporNo").value;
            var regex = new RegExp("^[A-Z0-9]+$")
            if (regex.test(input) && input.length === 8) {

                //$("input#PassporNo").on("input", function () {
                alert("blabla")
                $.ajax({
                    //base address/controller/Action
                    url: '/Patnicis/GetPasos/' + input,
                    type: 'POST',
                    
                    data: null,

                    success: function (result) {
                        alert(JSON.Stringify(result));
                    },
                    error: function (jqXHR, textStatus, errorThrown, data) {
                        alert(jqXHR.status);
                        alert(textStatus);
                        alert(errorThrown);
                        alert(data)
                    }
                });
                return false;
            }
        });
    });

edited Nov 03 '20 at 19:32

answered Nov 03 '20 at 18:27

Serge

40,935
4
18
45

Now I am getting alert box with undefined, why when I input the url in the browser I get "{"stateMachine":{"<>1__state":0,"<>t__builder":{" – Nenad Ristov Nov 03 '20 at 19:29
Thanks, I fixed the error. Now url: '/Patnicis/GetPasos/' + input, see my updated answer. – Serge Nov 03 '20 at 19:34
Still nothing, only the **error:** part is executed. Shouldn't the type be GET, not POST because I am looking to get data not post? – Nenad Ristov Nov 03 '20 at 19:41
instead of alert("blabla") put alert ("input - "+input) and let me know what is input value – Serge Nov 03 '20 at 19:46
Ajax ignores "GET" sometimes – Serge Nov 03 '20 at 19:46
when I input A1234567, the alert is **input - A1234567** – Nenad Ristov Nov 03 '20 at 19:57
can you put in your browser url ' ...../Patnicis/GetPasos/A1234567 – Serge Nov 03 '20 at 20:21
Solved it, I chenged the action type in the controller. – Nenad Ristov Nov 03 '20 at 20:24
I am happy for you. Pls don't forget accept the right answer – Serge Nov 03 '20 at 20:26

score -1 · Answer 2 · answered Nov 03 '20 at 20:26

-1

Solved

The ajax call stays the same, only the action type of the controller changes

[Route("~/Patnicis/GetPasos/{pasos}")]
        public async  Task<Patnici> GetPasos(string pasos)
        {
           

            var patnici =await  _context.Patnici
                .FirstOrDefaultAsync(m => m.PassporNo == pasos);

            return   patnici;
        }

answered Nov 03 '20 at 20:26

Nenad Ristov

11
9

This answer is an answer of the user @Serge below – Serge Nov 03 '20 at 20:43

How to make GET Ajax call to Asp.Net Core Mvc controller

2 Answers2