Angular Kendo Grid Filters and Sort information Missing when hitting MVC Controller

Question

I'm having a problem getting the filters and sort information from Kendo Grid to my MVC controller. I am using a service to pass form data and DataSource data to the MVC Controller.

Here is my Kendo Grid DataSource:

dataSource: new kendo.data.DataSource({
          transport: {
              read: function (e) {
                  generalsearchService.submitSearch(e.data, form)
                      .then(function success(response) {
                          e.success(response.data);
                      });
              }
          },
          schema: {
              data: "Data",
              total: "Total"
          },
          pageSize: 25,
          serverPaging: true,
          serverFiltering: true,
          serverSorting: true

      }),

Here is the code in my service:

  this.submitSearch = function (command, form) {
return $http.post('/SSQV4/SSQV5/Search/SubmitCriteria', {'command': command, 'form': form});

};

Here is my MVC Controller Method definition:

public async Task<ActionResult> SubmitCriteria(DataSourceRequest command, ContractorSearchViewModel form)

When it hits the dataSource the filter info is there:

When it hits the Service, the filter info is there:

When it hits the MVC Controller it is gone:

I tried including 'type: "aspnetmvc-ajax"', but it throws this error:

Any assistance is greatly appreciated!

Answer 1

Had to manually "inject" the aspnetmvc-server into the transport in order to get this to work. Here was the fix:

In the Angularjs Controller:

var form = $scope.form;
dataSource: new kendo.data.DataSource({
          transport: {
              read: function (e) {
                  var grid = $scope.SearchGrid;
                  var requestObject = (new kendo.data.transports["aspnetmvc-server"]({ prefix: "" }))
                      .options.parameterMap({
                          page: grid.dataSource.page(),
                          sort: grid.dataSource.sort(),
                          filter: grid.dataSource.filter(),
                          pagesize: grid.dataSource.pageSize()

              });
                  generalsearchService.submitSearch({ page: requestObject.page, sort: requestObject.sort, filter: requestObject.filter, pagesize: requestObject.pagesize, form: form })
                      .then(function success(response) {
                          e.success(response.data);
                      });
                }
            },
              schema: {
                  data: "Data",
                  total: "Total"
              },
          pageSize: 25,
          serverPaging: true,
          serverFiltering: true,
          serverSorting: true

In the Angularjs Service:

  this.submitSearch = function (form) {
return $http.post('/SSQV4/SSQV5/Search/SubmitCriteria', form );

};

In the MVC Controller:

        public async Task<ActionResult> SubmitCriteria([DataSourceRequest] DataSourceRequest request, ContractorSearchViewModel form)

Everything working as it should. Hope this helps someone else. Happy coding!