get json from controller MVC in java script

Question

I am trying to make some mvc application and I have a problem. I want to get json from mvc controller in javascript file:

JS:

var actionUrl = '@Url.Action("GetJsonTest", "JsonTest")';
$.getJSON(actionUrl, function (response) {
    if (response != null) {
        var html = "<li>" + response.Id + " " + response.Name + " " + response.Author + "</li>";
        $("h2").append(html);
    }
});

Controller:

[HttpGet]
public ActionResult GetJsonTest() {
    var books = new Book() {
        Id = '1',
        Name = "1+1",
        Author = "Varnava",
        Price = 100
    };
    return Json(books, JsonRequestBehavior.AllowGet);
}

It's not working. I have 404 error. It cant get something from controller. What am I doing wrong? Sorry for bad English. Hope you understand what I ask.

What's the name of the Controller? From you Url.Action, I would assume JsonTest, but is it actually called JsonTestController.cs? — sleeyuen
– sleeyuen, Commented Mar 14, 2017 at 20:39
Your code should work as long as your GetJsonTest method is inside JsonTestController.cs — Shyju
– Shyju, Commented Mar 14, 2017 at 20:42
@sleeyuen hi, yes, it is actually called JsonTestController. — Stanislav Muryndin
– Stanislav Muryndin, Commented Mar 14, 2017 at 20:51
cshtml files will be intepreted by the MVC template server. Anything else will not so your js file is tryin to make the literal request to url '@Url.Action("GetJsonTest", "JsonTest")'. If you did some debugging in your browser this would be immediately obvious. — Igor
– Igor, Commented Mar 14, 2017 at 21:06

csharpbd · Accepted Answer · 2017-03-14 21:04:27Z

3

You have mentioned that you are trying to call GetJsonTest from a javascript file: js. You have used to generate ajax url using

var actionUrl = '@Url.Action("GetJsonTest", "JsonTest")';

above Razor statement from .js file. The problem is that the javascript file can't execute Razor statement. But in .cshtml can. So, if you use this Razor statement from javascript within .cshtml it will work and if you use this Razor statement from javascript within .js it will not work. You have to call like this from .js file:

var actionUrl = '/JsonTest/GetJsonTest';
$.getJSON(actionUrl, function (response) {
    if (response != null) {
        $("h2").append("<li>" + response.Id + " " + response.Name + " " + response.Author + "</li>")
    }
});

answered Mar 14, 2017 at 21:04

csharpbd

4,1164 gold badges27 silver badges34 bronze badges

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

Comments

gmed · Accepted Answer · 2017-03-14 20:38:56Z

0

have you defined route in your routeconfig.cs?

you should have something like

   public class RouteConfig
    {
        public static void RegisterRoutes(RouteCollection routes)
        {
                routes.MapRoute(
                name: "YOUR NAME",
                url: "{YOUR CONTROLLER NAME}/{GetJsonTest}",
                defaults: new { controller = "YOUR CONTROLLER NAME", action = "GetJsonTest" }
            );
    }
    }

answered Mar 14, 2017 at 20:38

gmed

1401 silver badge10 bronze badges

Collectives™ on Stack Overflow

get json from controller MVC in java script

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related