connecting asp.net MVC application to Asp.net webapi

4 posts, 0 answers
  1. onjus
    onjus avatar
    8 posts
    Member since:
    May 2018

    Posted 14 May 2018 Link to this post

    HI I have asp.net mvc application with below telerik grid whcih i want to bind with asp.net webapi hosted on IIS. i can't find any ecample where to put the webapi url and how weapi's controller is invoked. please help in responding to this

     

     @(Html.Kendo().Grid<TelerikMvcApp131.Models.DeviceDetailsChild>()
                            .Name("webapi_grid")
                            .Columns(columns =>
                            {
                                columns.Bound(p => p.person).Title("ID").Width(100);
                             
                                columns.Command(command => { command.Edit(); command.Destroy(); }).Width(200);
                            })
                            .ToolBar(tools =>
                            {
                                tools.Create();
                            })
                            .Sortable()
                            .Pageable()
                            .Filterable()
                            .DataSource(dataSource =>
                                dataSource
                                .WebApi()
                                .Model(model =>
                                {
                                    model.Id(p => p.Network);
                                })
                                .Events(events => events.Error("error_handler"))
                                .Read(read => read.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "product" })))
                         
                            )
                        )

     

    Where should i define DefaultApi inside asp.net mvc application (note DefaultApi is defined inside webapi already)

  2. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 16 May 2018 Link to this post

    Hello,

    We do have an example that shows how to bind the Kendo UI Grid for ASP.NET MVC to web api controller. Please take a look at the https://github.com/telerik/ui-for-aspnet-mvc-examples/tree/master/grid/grid-web-api-crud-incell project. The project also supports CRUD operations if you need such support within your scenario. 

    I would suggest to take a look at the WebApiConfig.cs file in the App_Start folder where the the http route for the DefaultApi is defined and Global.asax file where this route is registered for the application. 


    Regards,
    Boyan Dimitrov
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. onjus
    onjus avatar
    8 posts
    Member since:
    May 2018

    Posted 17 May 2018 in reply to Boyan Dimitrov Link to this post

    but in this example, everything is returned from asp.net mvc application like inside constructor of ProductController().   what i need is something like below

    1.kendogrid-->attached to mvc controller 

    2.mvc controller makes call to web api hosted somewhere and fetches data back

    3.some calculations inside mvc controller 

    4.and finally mvc controller returns refined data to kendo grid

     

     

     

  4. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 18 May 2018 Link to this post

    Hello,

    I would like to suggest an approach for your case since we do not have such example. Since the mvc controller is not where happens the actual retrieval of data from the data base you can simply extract the query parameters from request url as shown below: 

    string queryParams = this.Request.RequestUri.Query;

    This will help you to construct the url to call the actual web api hosted somewhere and the web api controller should be able to parse the incoming query parametes and create the DataSourceRequest object containing information about the filter, sort and etc descriptors. The web api controller method should have such signature: 

    public DataSourceResult Get([System.Web.Http.ModelBinding.ModelBinder(typeof(WebApiDataSourceRequestModelBinder))]DataSourceRequest request)
           {
               return db.Products.Select(p => new ProductViewModel
               {
                   ProductID = p.ProductID,
                   ProductName = p.ProductName,
                   UnitPrice = p.UnitPrice ?? 0,
                   Discontinued = p.Discontinued,
                   UnitsInStock = p.UnitsInStock ?? 0
               }).ToDataSourceResult(request);
           }


    Make the data fetch and calculations and return the data to the mvc controller and the mvc controller will return it to the grid. 

    Regards,
    Boyan Dimitrov
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top