Web API Route config not firing by angularjs with multiple parameters

Question

Please check my WebApiConfig, API Controller and angular Service. 1st route is working fine but 2nd and 3rd not calling by angularjs. though web api route is ok.

--WebApiConfig

public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {

        config.Formatters.Remove(config.Formatters.XmlFormatter);

        config.Routes.MapHttpRoute(
            name: "DefaultApi",
            routeTemplate: "api/{controller}/{action}/{param}",
            defaults: new { param = RouteParameter.Optional }
        );
        config.Routes.MapHttpRoute(
            name: "Api2",
            routeTemplate: "api/{controller}/{action}/{param1}/{param2}",
            defaults: new { param1 = RouteParameter.Optional, param2 = RouteParameter.Optional }
        );
        config.Routes.MapHttpRoute(
            name: "Api3",
            routeTemplate: "api/{controller}/{action}/{param1}/{param2}/{param3}",
            defaults: new { param1 = RouteParameter.Optional, param2 = RouteParameter.Optional, param3 = RouteParameter.Optional }
        );
    }
}

--Web API Controller

[HttpPost]
public IHttpActionResult InsertAcademicInfo(AcademicInformation[] param1, AcademicResult[] param2)
{
     return Ok(_academic.InsertAcademicInformation(param1, param2).Data);
}

--Angular Service

mainApp.factory('AcademicServices', ['$http', '$rootScope', function ($http, $rootScope) {
  return {
    Save: function (academic, results) {
        return $http({
            url: '/Api/ApiAcademic/InsertAcademicInfo',
            method: 'POST',
            data: { param1: academic, param2: results },
            async: false
        });
    },
  };
}]);

As per your route api/{controller}/{action}/{param1}/{param2}: param1 and param2 are supposed to be present in the URL. However in your Http POST, the url is api/ApiAcademic/InsertAcademicInfo and the parameters are in the post body so this won't work! Can you include the rest of your controller and mention which actions work and which don't? — degant
– degant, Commented May 8, 2017 at 9:53
Api/ApiAcademic/Details(int param) -- param(which working fine with first route) Api/ApiAcademic/InsertAcademicInfo(AcademicInformation[] param1, AcademicResult[] param2) -- Not working — sebu
– sebu, Commented May 8, 2017 at 9:57

Igor · Accepted Answer · 2017-05-08 09:59:50Z

1

That is not how post works in Web API. What you are sending does not match what you are expecting. If you want to send data via the message body you need to send a single object, this object can be complex. This is what you are currently doing from your angular/javascript call but not what you are expecting in your web api method. Change your web api like the following to accomplish this.

Also you really should be using route attributes instead of trying to create a monolithic routing table that will accommodate all your routes across all your controllers. Use RouteAttribute and RoutePrefixAttribute. Also you do not need any parameters in the method below because you are sending the data using the requests message body and not in the URI.

AcademicInfoModel.cs

public class AcademicInfoModel {
    public AcademicInformation[] param1 {get;set;}
    public AcademicResult[] param2 {get;set;}
}

ApiAcademicController.cs

[RoutePrefix("api/ApiAcademic")]
public class ApiAcademicController : ApiController
{

    [HttpPost]
    [Route("InsertAcademicInfo")]
    public IHttpActionResult InsertAcademicInfo(AcademicInfoModel model)
    {
         return Ok(_academic.InsertAcademicInformation(model.param1, model.param2).Data);
    }
}

edited May 8, 2017 at 9:59

answered May 8, 2017 at 9:56

Igor

62.5k10 gold badges111 silver badges181 bronze badges

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

3 Comments

sebu Over a year ago

but i think this is a complex solution, though in jquery i have worked on it.

sebu Over a year ago

i need to send data url.

Igor Over a year ago

@sebu - why would you do that? If its an atomic value / simple type (like string, int, etc) then using the URI is fine but on a POST with complex data in an array sending in the message body is very much preferred.

Collectives™ on Stack Overflow

Web API Route config not firing by angularjs with multiple parameters

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related