showing json from Web API controller on Razor view

Question

I am working on an asp.net MVC 5 application. I created a Web API 2 controller which returns list of medicines. Now I want to display them to view. I created another controller named homecontroller and index action method ( because I think api controller can not have action method). I created index view. In that view I want to show that list of medicines. I followed this link http://www.asp.net/web-api/overview/web-api-routing-and-actions/routing-in-aspnet-web-api

I am trying this code:

var uri = '/api/Medicines';

$(document).ready(function () {
    // Send an AJAX request
    $.getJSON(uri)
        .done(function (data) {
            // On success, 'data' contains a list of products.
            $.each(data, function (key, item) {
                // Add a list item for the product.
                $('<li>', { text: formatItem(item) }).appendTo($('#products'));
            });
        });
});

but getting 404 in browser console.

This is the Web APi controller method:

public class MedicinesController : ApiController
{
    public IEnumerable<Medicine> GetMedicines()
    {
        Random rnd = new Random();
        return medicines.OrderBy(x => rnd.Next()).ToList();
    }
}

Route config is:

public static void Register(HttpConfiguration config)
{
    config.MapHttpAttributeRoutes();

    config.Routes.MapHttpRoute(
        name: "DefaultApi",
        routeTemplate: "api/{controller}/{id}",
        defaults: new { id = RouteParameter.Optional }
    );
}

Please suggest how to fix this. I need list of medicines in json format.

Thanks

Do you have another actions in Medicines controller having name starting with 'Get'? — liri2006, Jun 05 '14 at 09:23

score 1 · Answer 1 · edited Jun 20 '20 at 09:12

Link '/api/Medicines' will work if route is configured similar to

routes.MapHttpRoute(
    name: "API Default",
    routeTemplate: "api/{controller}/{id}",
    defaults: new { id = RouteParameter.Optional }
);

But if you have it like this (there both versions in tutorial)

routes.MapHttpRoute(
    name: "ActionApi",
    routeTemplate: "api/{controller}/{action}/{id}",
    defaults: new { id = RouteParameter.Optional }
);

you have to also specify Action name in uri '/api/Medicines/Medicines'.

UPDATE

I've created new MVC 5 project with WebApi and everithing worked without any problems and hacks. You cant try to compare with your solution - test repo on github.

score 0 · Answer 2 · answered Jun 05 '14 at 09:07

0

If you have stadard route configuration and not use any areas etc your uri should be

var uri = '/Medicines/GetMedicines'

And as Joanvo said you migth be need allowGet setting in return. Like this:

return Json(medicines.OrderBy(x => rnd.Next()), JsonRequestBehavior.AllowGet);

answered Jun 05 '14 at 09:07

AntonE

632
5
13

remember that i am using this url in home/index view and my api controller is medicinecontroller – DotnetSparrow Jun 05 '14 at 09:09
In your route config you not have any mentions about action. And not have any action by default. Can you change it to something like "url: "{controller}/{action}/{id}", defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional },"? And try again? – AntonE Jun 05 '14 at 09:17
@Antonio97 WebApi != Asp.NET MVC. You suggesting changes in MVC routing, but DotnetSparrow has problem with WebApi routing. – liri2006 Jun 05 '14 at 13:10

showing json from Web API controller on Razor view

2 Answers2

UPDATE